BullGuard Antivirus Sale - 60% Off with openElement !
Accueil Forum Accueil Forum >

openElement

> Web Café > Code (JS, PHP, CSS etc.), techniques etc.
  Nouveaux messages Nouveaux messages Fil RSS  - Amélioration de ce JQ possible ?
  FAQ FAQ  Rechercher dans le Forum   Inscription Inscription  Connexion Connexion

Amélioration de ce JQ possible ?

 Répondre Répondre
Auteur
Message
nico38 allez vers le bas
Senior Member
Senior Member


Depuis le: 18 Jan 2014
Status: Inactif
Points: 3967
Options des messages Options des messages   Thanks (0) Thanks(0)   Citer nico38 Citer  RépondreRéponse Lien Direct à ce Post Sujet: Amélioration de ce JQ possible ?
    Envoyé : 24 Août 2015 à 15:23
Bonjour,
je pense que je peux améliorer ce code genre avec 'each"..... mais j'arrive pas à voir.

- J'ai 3 panneaux
- dans chacun de ces panneau j'ai une image qui à une transition quand on la survol

- le code ci-dessous veut imiter le survol de l'image quand on survol le panneau et inversement quand on ne survol plus le panneau :
------------------------------------------------------------------------------------------
/*1er panneau : WE=panneau, rond1=image*/

$('#WEa558810312').mouseover(function(){
    $('.rond1').mouseover();
});
$('#WEa558810312').mouseout(function(){
    $('.rond1').mouseout();
});
/*1er panneau*/
$('#WE72d56c7efc').mouseover(function(){
    $('.rond2').mouseover();
});
$('#WE72d56c7efc').mouseout(function(){
    $('.rond2').mouseout();
});
/*1er panneau*/
$('#WE70a54b5aa3').mouseover(function(){
    $('.rond3').mouseover();
});
$('#WE70a54b5aa3').mouseout(function(){
    $('.rond3').mouseout();
});
------------------------------------------------------------------------------------------

Pensez vous que ce code est améliorable ? (donner la meme class "rond" ?)

------------------------------------------------------------------------------------------
j'ai tenté ça sans succès :
$(function() {
    $('.panneau').each(function() {
       
        $(this).mouseover(function() {
        $('.ronds').mouseover();
    });           
            $(this).mouseleave(function() {
        $('.ronds').mouseleave();
    });
 
});

------------------------------------------------------------------------------------------

Edité par nico38 - 24 Août 2015 à 15:24
Un lien vers ton site tu enverras | Problème d'affichage ? ---> CTRL+F5 | Couleur des liens --> "Styles des liens"
Haut de la page
Larsene allez vers le bas
Admin Group
Admin Group


Depuis le: 05 Mar 2012
Pays: France
Status: Inactif
Points: 5388
Options des messages Options des messages   Thanks (0) Thanks(0)   Citer Larsene Citer  RépondreRéponse Lien Direct à ce Post Envoyé : 24 Août 2015 à 16:07
regarde l'usage de this :

 

function () {
          $(".panneau", this).fonction());
        },


Haut de la page
Dmit OE allez vers le bas
Admin Group
Admin Group


Depuis le: 31 Mai 2012
Status: Inactif
Points: 13971
Options des messages Options des messages   Thanks (0) Thanks(0)   Citer Dmit OE Citer  RépondreRéponse Lien Direct à ce Post Envoyé : 24 Août 2015 à 16:26
Bonjour.

Voici ce que j'ai teste: il faut mettre sur chaque element-declencheur les classes "panneau" plus "rondX" (rond1, rond2, ...., rond164....), et le classe correspondant "rondX" sur les elements affectés; puis

$(function(){
$('.panneau').each(function() {
var classes = $(this).attr('class'); // contient "... panneau rondX ..."
var _classRond = classes.match(/ rond[\d]+/)[0]; // trouver " rondX" (il faut prendre le premier resultat)
var $affectedElement = $('.' + _classRond.trim()).not('.panneau'); // enlever l'espace avant rondX, et exclure le declencheur (qui a le meme class!)
$(this).mouseover(function(){
$affectedElement.fadeOut();
});
$(this).mouseout(function(){
$affectedElement.fadeIn();
});
});
});


Edité par Dmit OE - 24 Août 2015 à 16:26
Haut de la page
nico38 allez vers le bas
Senior Member
Senior Member


Depuis le: 18 Jan 2014
Status: Inactif
Points: 3967
Options des messages Options des messages   Thanks (0) Thanks(0)   Citer nico38 Citer  RépondreRéponse Lien Direct à ce Post Envoyé : 24 Août 2015 à 17:20
merci je vais tester !
Un lien vers ton site tu enverras | Problème d'affichage ? ---> CTRL+F5 | Couleur des liens --> "Styles des liens"
Haut de la page
 Répondre Répondre
  Partagez ce sujet   

Aller au Forum Permissions du forum allez vers le bas

Forum Software by Web Wiz Forums® version 12.04
Copyright ©2001-2021 Web Wiz Ltd.

Cette page a été affichée en 0.047 secondes.