Aller au contenu
  • Pas encore inscrit ?

    Pourquoi ne pas vous inscrire ? C'est simple, rapide et gratuit.
    Pour en savoir plus, lisez Les avantages de l'inscription... et la Charte de Zébulon.
    De plus, les messages que vous postez en tant qu'invité restent invisibles tant qu'un modérateur ne les a pas validés. Inscrivez-vous, ce sera un gain de temps pour tout le monde, vous, les helpeurs et les modérateurs ! :wink:

simous

Modifier CSS avec Javascript

Messages recommandés

Bonjour à tous et à toutes...

 

Voici une partie de ma CSS :

 

#simous { list-style-type: none; padding: 5px; margin: 0px; color: #fff; background-color: #494949;top:14px;left:0;width:160px  }

#simous .elements { display: none; list-style-type: none; padding: 5px }

 

J'aimerais modifier les propriétés de la classe "elements" (display:block) par un javascript en fonction du navigateur (pour IE et Opera)

 

Quelqu'un aurait-il une astuce ?

 

Merci :P

Modifié par simous

Partager ce message


Lien à poster
Partager sur d’autres sites

Salut Tangui :P

 

Effectivement c'est une solution mais que ne peut pas fonctionner dans mon cas précis :-(

 

Il me faut modifier le paramètre display de la classe elements via un javascript :-P

Partager ce message


Lien à poster
Partager sur d’autres sites

J4ai rien trouvé sur la manipulation directe des classes, par contre on trouve facilement des exemples de getElementsByClassName() qui te permettent de changer le style des éléments à la volée...

 

-- edit --

En fait, c'est casse-pieds de reparcourir tous les éléments de la page en cherchant ceux qui ont un classname égal à la classe que tu veux, et de leur modifier individuellement l'attribut display ...

 

Quelques personnes se sont penchées sur le même problème avec plus ou moins de succès :

http://forums.devshed.com/t115036/s41d66d9...acdf98c72a.html

 

Un exemple :

<STYLE ID="tssxyz" TYPE="text/css"></STYLE>
<script LANGUAGE="JavaScript1.2"><!--
var agt=navigator.userAgent.toLowerCase();
if ( (parseInt(navigator.appVersion)==4) && 
    (agt.indexOf('mozilla')!=-1) && (agt.indexOf('spoofer')==-1)
              && (agt.indexOf('compatible') == -1) ) {
document.tags.P.fontSize="25pt";
}
else if (agt.indexOf('gecko') != -1) { 
document.getElementById('tssxyz').sheet.insertRule('P { fontSize: 25pt }', document.getElementById('tssxyz').sheet.cssRules.length )
}
else if ( (parseInt(navigator.appVersion)>=4) && 
    (agt.indexOf('msie') != -1) ) {
document.styleSheets["tssxyz"].addRule ("P", "fontSize:25pt");
}
//--></SCRIPT>

 

En fait, ce qui va t'interesser, c'est le fait de pouvoir désigner par un id ta feuille de style (donc accessible par un document.getElementById() pour les navigateurs compatibles DOM) et d'y ajouter à la volée (avec sheet.insertRule()) la règle qui t'interesse, en fonction du navigateur...

Fais-en bon usage ;-)

Partager ce message


Lien à poster
Partager sur d’autres sites

Merci Kewlcat :P

 

Je suis arrivé à peu près à la même conclusion, à savoir un addRule pour IE..

 

Par contre pour Opera, je vais donc tester ce sheet.insertRule que je ne connaissais pas.

 

Pour Firefox et Mozilla, pas de pb, la stylesheet fonctionne et n'a pas besoin d'etre modifiée.

 

Merci beaucoup pour avoir pris le temps de chercher, je vois que l'equipe Zebulon est toujours aussi efficace :-(

Partager ce message


Lien à poster
Partager sur d’autres sites

Join the conversation

You are posting as a guest. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Invité
Répondre à ce sujet…

×   Collé en tant que texte enrichi.   Coller en tant que texte brut à la place

  Seulement 75 émoticônes maximum sont autorisées.

×   Votre lien a été automatiquement intégré.   Afficher plutôt comme un lien

×   Votre contenu précédent a été rétabli.   Vider l’éditeur

×   Vous ne pouvez pas directement coller des images. Envoyez-les depuis votre ordinateur ou insérez-les depuis une URL.


  • En ligne récemment   0 membre est en ligne

    Aucun utilisateur enregistré regarde cette page.

×
×
  • Créer...