Effet de flou

Fermé
danwolf7 Messages postés 54 Date d'inscription jeudi 29 octobre 2009 Statut Membre Dernière intervention 12 juillet 2016 - Modifié par danwolf7 le 21/06/2013 à 00:54
karirovax Messages postés 3221 Date d'inscription dimanche 17 janvier 2010 Statut Membre Dernière intervention 22 juin 2016 - 23 juin 2013 à 13:37
Bonjour,

Je souhaiterais réaliser un scripte pour faire des effets de flous en JavaScript ou jQuery.

Sachant que cet effet de flou n'est au fait qu'un empilement d'images avec décalages, comment faire pour que le script fasse finalement des sortes de captures de l'écran et les additionne les unes sur l'autres ?

Finalement, l'effet voulu est comme celui de la nouvelle interface soundcloud lorsqu'on veut partager un son et personnaliser le player. Toute la page derrière la box est floue et même lorsque l'on scroll.

Je précise que j'aimerais de préférence faire ce scripte à la main et non pas télécharger un plugin déjà tout fait.

Merci d'avance !

EDIT: Je viens de me rendre compte que sur la page Soundcloud, cet effet n'est d'autre qu'une propriété CSS3:
-web-kit-filter: blur(5px);


Mais la question reste toujours ouverte. Comment le faire en JS pour avoir une meilleure compatibilité ?

2 réponses

danwolf7 Messages postés 54 Date d'inscription jeudi 29 octobre 2009 Statut Membre Dernière intervention 12 juillet 2016 5
Modifié par danwolf7 le 21/06/2013 à 09:42
Désolé mais je ne comprends pas comment marche ce scripte, je n'arrive pas à l'adapter :S
Et est-ce que ça reste tout de même du JavaScript ? Ou c'est carrément du Java tout court ?
1
prosthetiks Messages postés 1189 Date d'inscription dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 431
21 juin 2013 à 14:11
Hello,

Voici comment je procéderait:
http://jsfiddle.net/Lrwxg/2/
0
karirovax Messages postés 3221 Date d'inscription dimanche 17 janvier 2010 Statut Membre Dernière intervention 22 juin 2016 203
21 juin 2013 à 15:40
Re:

Désolé, oui c'est un script du java, donc je suis infiniment désolé, j'ai trompé un peut et j'ai pas faire attention entre java et javascript.

Sorry
0
danwolf7 Messages postés 54 Date d'inscription jeudi 29 octobre 2009 Statut Membre Dernière intervention 12 juillet 2016 5
23 juin 2013 à 13:24
Pas de problème ! C'est déjà très gentil d'avoir voulu m'aider alors merci :)
Sinon, prosthetiks, ton scripte est très intéressant, c'est effectivement en partie ce que je voulais. Mais comment faire pour que JS, au lieu de prendre une image définie, prenne l'ensemble de la fenêtre et le rende flou ?
0
karirovax Messages postés 3221 Date d'inscription dimanche 17 janvier 2010 Statut Membre Dernière intervention 22 juin 2016 203
23 juin 2013 à 13:37
Re:

de rien danwolf7, et merci de me comprendre :)
C'est un très bon script :) prosthetiks, je vote
0
karirovax Messages postés 3221 Date d'inscription dimanche 17 janvier 2010 Statut Membre Dernière intervention 22 juin 2016 203
21 juin 2013 à 02:08
salut

essayez ceci:

float[ ] matrice = {
0.1f, 0.1f, 0.1f,
0.1f, 0.2f, 0.1f,
0.1f, 0.1f, 0.1f
};
BufferedImageOp op = new ConvolveOp(new Kernel(3,3,matrice));
BufferedImage nouvelleImage = op.filter(bufferedImage, null);


source:

https://java.developpez.com/faq/gui?page=Les-images#GRAPHIQUE_IMAGE_flou

bonne chance :)
-1