Popup avec fond flouté [Résolu]

Messages postés
7
Date d'inscription
lundi 28 novembre 2005
Dernière intervention
23 juin 2008
- 20 juin 2008 à 09:47 - Dernière réponse :
Messages postés
2116
Date d'inscription
jeudi 16 septembre 2004
Dernière intervention
23 septembre 2018
- 23 juin 2008 à 19:30
Bonjour à tous !


pour être plus compréhensible avec mon sujet, voici une image pour montrer ce que je veux faire...

<!-- BBCode u2 Start -->http://img180.imageshack.us/my.php?image=floutenu6.png


voilà donc j'ai déjà réussi la popup et le fond "grisé" mais pour le flou alors là je ne sais pas faire du tout...


Meric beaucoup pour votre aide...
Afficher la suite 

Votre réponse

14 réponses

Meilleure réponse
Messages postés
2116
Date d'inscription
jeudi 16 septembre 2004
Dernière intervention
23 septembre 2018
- 21 juin 2008 à 14:38
3
Merci
Essaye ça, testé uniquement sous Firefox.

<html>

 

   
    Salut
 

 

   
    Salut
 

<script type="text/javascript">
    function $(id){
        return document.getElementById(id);
    }
    function flou(obj){
        var o1 = $(obj);
        o1.style.opacity = 0.2;
        for (x=-1 ; x<2 ; x++)
            for (y=-1 ; y<2 ; y++)
                if (!(x==0 && y==0)){
                    var o2 = o.cloneNode(true);
                    o.parentNode.appendChild(o2);
                    o2.style.opacity = 0.2;
                    o2.style.left = (parseInt(o.style.left) + x) + "px";
                    o2.style.top = (parseInt(o.style.top) + y) + "px";
                }
    }
    flou("floubox");
</script>

</html>

Bonne continuation !
Flachy Joe

Ta vie t'est prêtée, fais en un cadeau.

Merci Flachy Joe 3

Avec quelques mots c'est encore mieux Ajouter un commentaire

Codes Sources a aidé 88 internautes ce mois-ci

Commenter la réponse de Flachy Joe
Meilleure réponse
Messages postés
2116
Date d'inscription
jeudi 16 septembre 2004
Dernière intervention
23 septembre 2018
- 21 juin 2008 à 14:47
3
Merci
Oups :

                    var o2 = o1.cloneNode(true);
                    o1.parentNode.appendChild(o2);
                    o2.style.opacity = 0.2;
                    o2.style.left = (parseInt(o1.style.left) + x) + "px";
                    o2.style.top = (parseInt(o1.style.top) + y) + "px";

Précision :
Il faut un container parent pour que o1.parentNode.appendChild fonctionne, il faut aussi être en position absolue et définir left et top.

Flachy Joe

Ta vie t'est prêtée, fais en un cadeau.

Merci Flachy Joe 3

Avec quelques mots c'est encore mieux Ajouter un commentaire

Codes Sources a aidé 88 internautes ce mois-ci

Commenter la réponse de Flachy Joe
Messages postés
469
Date d'inscription
mercredi 9 janvier 2002
Dernière intervention
20 février 2017
- 20 juin 2008 à 10:18
0
Merci
Bonjour, bah facile, tu fais comme eux:
http://img180.imageshack.us/img180/7148/floutenu6.png

c'est une image flouté !

[o-_-o]
Commenter la réponse de Zobibol
Messages postés
7
Date d'inscription
lundi 28 novembre 2005
Dernière intervention
23 juin 2008
- 20 juin 2008 à 10:23
0
Merci
c'est ironique ?
Commenter la réponse de Tibzzzzz
Messages postés
469
Date d'inscription
mercredi 9 janvier 2002
Dernière intervention
20 février 2017
- 20 juin 2008 à 10:25
0
Merci
Bah non, c'est ce qu'ils font.
pour flouter une image en javascript/css je n'imagine même pas comment on peut faire si ce n'est que déplacée n fois une image ne n caractère en lui applicant une opacité !
ça risque d'être un peu lourd !

[o-_-o]
Commenter la réponse de Zobibol
Messages postés
7
Date d'inscription
lundi 28 novembre 2005
Dernière intervention
23 juin 2008
- 20 juin 2008 à 10:28
0
Merci
les textes derrière sont différents et chaque fois c'est une image flouté ?
Commenter la réponse de Tibzzzzz
Messages postés
469
Date d'inscription
mercredi 9 janvier 2002
Dernière intervention
20 février 2017
- 20 juin 2008 à 10:32
0
Merci
Qu'entends tu par

les textes derrière sont différents ? je ne comprends pas bien

[o-_-o]
Commenter la réponse de Zobibol
Messages postés
7
Date d'inscription
lundi 28 novembre 2005
Dernière intervention
23 juin 2008
- 20 juin 2008 à 10:36
0
Merci
C'est à dire, que si on va sur n'importe quel page du site, et que l'on clic sur blog, l'image qui est flouté derrière est différente à chaque fois.... c'est pas possible d'avoir autant d'image flouté par page et dès qu'il y a une modif faut refaire une image flouté ? whaa
Commenter la réponse de Tibzzzzz
Messages postés
469
Date d'inscription
mercredi 9 janvier 2002
Dernière intervention
20 février 2017
- 20 juin 2008 à 10:40
0
Merci
d'accord, je viens de réveiller mon neurone, c'est fait en flash !

[o-_-o]
Commenter la réponse de Zobibol
Messages postés
7
Date d'inscription
lundi 28 novembre 2005
Dernière intervention
23 juin 2008
- 20 juin 2008 à 10:42
0
Merci
ah oui d'accord.... tout s'explique...
Commenter la réponse de Tibzzzzz
Messages postés
7
Date d'inscription
lundi 28 novembre 2005
Dernière intervention
23 juin 2008
- 20 juin 2008 à 11:06
0
Merci
donc ce n'est pas possible sans passer par le flash ?
Commenter la réponse de Tibzzzzz
Messages postés
469
Date d'inscription
mercredi 9 janvier 2002
Dernière intervention
20 février 2017
- 20 juin 2008 à 11:15
0
Merci
bah justement, pour me détendre je regardais un peu, mais c'est pas évident, ça risque de faire des pages qui auront un poids de ouf mais ça doit être faisable en passant par l'opacité et les positions.

[o-_-o]
Commenter la réponse de Zobibol
Messages postés
7
Date d'inscription
lundi 28 novembre 2005
Dernière intervention
23 juin 2008
- 23 juin 2008 à 08:34
0
Merci
Merci c'est super !!!!!

Bonne semaine !
Commenter la réponse de Tibzzzzz
Messages postés
2116
Date d'inscription
jeudi 16 septembre 2004
Dernière intervention
23 septembre 2018
- 23 juin 2008 à 19:30
0
Merci
Pense à accepter la réponse, pour que les suivants trouve la solution plus facilement.

Flachy Joe

Ta vie t'est prêtée, fais en un cadeau.
Commenter la réponse de Flachy Joe

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.