Accueil > Forum > > > > faire bouger l'arrière plan d'un <div>
 faire bouger l'arrière plan d'un <div>
jeudi 25 décembre 2008 à 23:54:42 |
faire bouger l'arrière plan d'un <div>
johnnylechat
|
Bonjour à tous, Je vous expose mon problème : pour un menu, je dispose de liens définis de la manière suivante dans le css : "a {width:100%; height:100%; display:block; background-image:url(../../bg.png); background-position:-207px top; background-repeat:no-repeat; }" l'image bg.png, est donc mon image d'arrière plan et, dans cet état, n'est pas visible car positionnée en dehors de mon . Je souhaiterais que lors du click sur le lien, celle-ci apparaisse avec un effet "slide" ou glissé (càd, de la position x=-207px à la position x=0). J'espérais pouvoir me servir des outils de la bibliothèque scriptaculous, mais je n'y arrive pas... l'un d'entre vous aurait-il une idée pour m'aider ? Je vous remercie d'avance Johnny le Chat |
|
vendredi 26 décembre 2008 à 12:30:01 |
Re : faire bouger l'arrière plan d'un <div>
Bul3
|
bonjour, "il suffit" de récupérer la position de l'image, puis d'appeler une fonction avec setTimeout qui la déplace, progressivement, "jusqu'à 0" Cordialement la position de l'image, c'est window.getComputedStyle(lien,null).backgroundPosition pour FF
et lien.currentStyle.backgroundPositionX + lien.currentStyle.backgroundPositionY pour IE
le reste tu devrais savoir faire.... |
|
mercredi 31 décembre 2008 à 17:46:12 |
Re : faire bouger l'arrière plan d'un <div>
DakM
|
Pour avoir les meilleurs exemples & codes Script.aculo.us:
http://github.com/madrobby/scriptaculous/wikis/combination-effects-demo
et pour ton background, crrer une image PNG, de 0 a 100px par ex: rien, transparent
& 100->200 ton background, peut etre que firefox/autres interpretent mal le -200 px pour une image.. a verifier !
good luck
|
|
Cette discussion est classée dans : plan, image, position, background, bouger
 Répondre à ce message
 Sujets en rapport avec ce message
Position background [ par PROTECTIONNISTE ]
Bonjour,Je voudrais savoir si il est possible de faire démarrer la position de l'image à partir d'un nombre de pixel désiré, non pas au niveau de la f
Arriere-plan image changeante on refresh adaptee a l ecran du client [ par pearlp ]
Bonsoir ! Voiala ca fais 5 jours que j'essaie de trouver un scripte qui me permetterai d avoir une nouvelle image arriere plan a chaque rafraichissem
Resize du contenu en fonction du background. [ par 90max ]
Bonjour à tous, Pour mon site, j'aimerais travailler avec une photo en background. Cette photo doit faire 100% de l'écran, chose faite grâce au plugi
Position de souris [ par Pmarcopolo ]
Bonsoir à tous. Aprés quelques jours de recherche infructueux, je fait appel aux connaisseurs, à savoir : En fond de plan j'ai une image et je souhait
Changement automatique d'image [ par dpechou ]
Bonjour, je cherche un script permettant de changer d'image background en fonction: - du navigateur - et ensuite du mois, en effet je veux changer
position de la souris sur une image [ par golgoth ]
Bonjour,Comment faire pour recuperer dans un lien la position de la souris sur une image quand je clic sur celle-ci ? Est ce possible ?Merci pour votr
Lightbox positionnement problématique... [ par Hevlaska ]
Bonjour tout le monde,Je suis une débutante, qui poursuit un stage avant de commencer l'université. Je ne sais pas trop si je suis au bon endroit mais
Prototype/Scriptaculous && Background-position [ par DakM ]
Bonjour ! J'ai ce calque: [code=js]var div = new Element('div', {'id': this._id, 'class': css.map.container, 'style': 'display:none; width: 100%; hei
parentnode d'un <option> [ par themagician67 ]
Bonjour, J'ai une question. J'ai deux "select multiple" et je fais des déplacements de valeurs avec des images de fond dans les options. Quand on pas
Centrer une image en background (image > fenêtre) [ par sagat06 ]
Bonjour, un exemple étant plus parlant que 1000 mots, j'aimerais savoir comment le site suivant centre son background (jpeg 1920*1200) le site => ht
 Livres en rapport
|
Derniers Blogs
 SLIDE & DéMO TECHDAYS 2012 - FAST & FURIOUS XAML APPSSLIDE & DéMO TECHDAYS 2012 - FAST & FURIOUS XAML APPS par Vko
Retrouvez les slides et les démo de ma session Fast & Furious XAML Apps. A ceux qui se posent la question : "est-ce que le code de la DataGrid est disponible?", je vous répondrais "pas encore". Je vais mettre en place un projet codeplex pour part...
Cliquez pour lire la suite de l'article par Vko XNA IS DEAD!XNA IS DEAD! par richardc
Depuis la semaine dernière (et grâce aux TechDays 2012), je me penche activement sur la nouvelle version de Windows, aka Windows 8. Vous me direz, il était temps puisque la première preview date de Septembre dernier.
OK. Remarquez, on n'en est qu'aux...
Cliquez pour lire la suite de l'article par richardc TECHDAYS PARIS 2012 : WINDOWS SERVER "8" QUOI DE 9 !TECHDAYS PARIS 2012 : WINDOWS SERVER "8" QUOI DE 9 ! par ROMELARD Fabrice
Speakers: Fabrice Meillon et Stanislas Quastana Cette session est basée entièrement sur celle donnée lors de la BUILD cet hiver. Il n'y a pas d'ajout d'information en rapport avec cet évènement passé. Windows 8 Server sera intégralem...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice [HTML5] AUTOUR DU W3C : NOUVEAUX STANDARDS ET WEB MOBILE (LILLE)[HTML5] AUTOUR DU W3C : NOUVEAUX STANDARDS ET WEB MOBILE (LILLE) par Gio
Je m'y prends un peu tard je sais, mais bon je suis développeur web et donc hyper fainéant ! Toujours dans le cadre des technologies émergentes, ici HTML5, parce qu'on aime HTML5 chez Wyg , nous seront présent, le vieux ( Aurélien V.) et moi, pour pr...
Cliquez pour lire la suite de l'article par Gio
Logiciels
 DocTranslate (V3.1.0.0)DOCTRANSLATE (V3.1.0.0)DocTranslate est un traducteur de document Microsoft Word, PowerPoint et Excel. Il permet d'autom... Cliquez pour télécharger DocTranslate Tribler (2012)TRIBLER (2012)Tribler est un client pair à pair (P2P/Peer-to-Peer) open source avec la capacité de regarder des... Cliquez pour télécharger Tribler OneSwarm (2012)ONESWARM (2012)Le peer-to-peer qui protège votre vie privée, c'est OneSwarm.
Ce logiciel de peer-to-peer crypté... Cliquez pour télécharger OneSwarm PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V8.4)PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V8.4)PONAMEDIA TV DEVIENS HELLLOOO FLASH
LA TV SUR VOTRE ORDINATEUR.
Toute une plateforme Multi... Cliquez pour télécharger PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO Academy System (17.2.1.0)ACADEMY SYSTEM (17.2.1.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System
|