Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1508 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  css/javascript/firefox attribut hors standard

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

css/javascript/firefox attribut hors standard

n°1065434
makinatoto
Posté le 29-04-2005 à 10:56:09  profilanswer
 

style_1 { font-family: Courier; font-size: 10pt; padding: 0;background-color: #FFFFFF; colorActif: #57C0F2; color: #000000; border: 1px groove;  }
 
voilà j'ai defini ma css comme ci dessus
l'attribut  colorActif n'existe pas dans les standards
sous IE je peux qd meme y a acceder
j'ai codé cette fonction pour retrouver la css qui m'interesse:
 
function findStyleRule(styleName) {
var stS=document.styleSheets?document.styleSheets: document.styleSheet;  
var ok=stS[0].rules?1:0;  
for (i = 0; i < stS.length; i++)  
    for (j = 0; j < eval("stS[i]."+(ok?"rules":"cssRules" )+".length" ); j++)  
      if (eval("stS[i]."+(ok?"rules":"cssRules" )+"[j].selectorText" ) == styleName)  
        return eval("stS[i]."+(ok?"rules":"cssRules" )+"[j]" );  
}

 
cette fonction marche sous IE et firefox
soit _field un champ input text
 
strule=findStyleRule("."+_field.className).style;
sous IE je recupère strule.colorActif
mais sous firefox je n'ai rien
 
j'ai testé strule.cssText
sous IE il me sort tout ce que j'ai enregistré pour le style
sous firefox  seulement les attribut du standard
 
Je cherche donc une solution pour accéder à la valeur d'un attribut d'une css que j'ai défini moi-meme et n'étant donc pas dans les standards
 
Si vous connaissez une autre manière de definir la couleur d'un element actif c a dire comme pour les liens en css par exemple hover actif .... je suis preneur
 
Mon but est de changer la couleur du background du champ input qd celui est sélectionné (en gros un curseur)  
je veux absolument passer par les css (j'ai mes raisons et ça serait trop long à expliquer)  
 
Merci d'avance pour vos réponses

mood
Publicité
Posté le 29-04-2005 à 10:56:09  profilanswer
 

n°1065436
FlorentG
Unité de Masse
Posté le 29-04-2005 à 10:58:05  profilanswer
 

pouet:active {
  color: #57C0F2;
}


Et tu fait le p'tit script pour le support pour IE. Sur les autres navigateurs, ça fonctionnera d'origine.

n°1065458
makinatoto
Posté le 29-04-2005 à 11:15:38  profilanswer
 

FlorentG a écrit :

pouet:active {
  color: #57C0F2;
}


Et tu fait le p'tit script pour le support pour IE. Sur les autres navigateurs, ça fonctionnera d'origine.


 
tu veux dire du style :
 
<style>.pouet:active {  
  background-color: #57C0F2;  
}</style>
<input type="text" id="pouet" name="pouet">

 
en fait ça marche pour les liens mais pas pour les champs ou j'écris mal qque chose ms je sais pas quoi

n°1065460
FlorentG
Unité de Masse
Posté le 29-04-2005 à 11:17:26  profilanswer
 

En fait après test, je ne crois pas que ce soit possible, il faut malheureusement passer par du JavaScript, en attachant les événements onfocus et onblur...

n°1065461
KangOl
Profil : pointeur
Posté le 29-04-2005 à 11:17:46  profilanswer
 

non
 

Code :
  1. <style type="text/css">.pouet:active { 
  2.   background-color: #57C0F2; 
  3. }</style>
  4. <input type="text" class="pouet" name="pouet" />


 
si tu inclus des css, autant le faire a fond et respecter les standards...


---------------
Nos estans firs di nosse pitite patreye...
n°1065463
FlorentG
Unité de Masse
Posté le 29-04-2005 à 11:18:49  profilanswer
 

Ah non pardon, faut faire comme ça :

input:focus {
  background: #57c0f2;
}


Testé et approuvé sous FireFox, mais IE ne gère évidemment pas :(

n°1065466
makinatoto
Posté le 29-04-2005 à 11:22:41  profilanswer
 

<style type="text/css">.pouet:focus {    
  background-color: #57C0F2;    
}</style>  
<input type="text" class="pouet" name="pouet" />


 
Merci beaucoup
 
pour IE plus qu'à adapter ma premiere solution à celle là lol


Message édité par makinatoto le 29-04-2005 à 11:26:06
n°1065467
FlorentG
Unité de Masse
Posté le 29-04-2005 à 11:23:10  profilanswer
 

Maintent reste à faire fonctionner sous IE avec un bout de JS :)

n°1065482
KangOl
Profil : pointeur
Posté le 29-04-2005 à 11:28:39  profilanswer
 

pour ie, arrange toi avec ces deux fonctions js...

Code :
  1. // leave container arg out, and will default to document.  
  2. // code from http://www.webmasterworld.com/forum91/1757.htm (unbugged)
  3. function getElementsByClassName(className,container) 
  4.   container = container||document ;
  5.   var all = container.all||container.getElementsByTagName('*'); 
  6.   var arr = [] ;
  7.   var att = (document.all)?"className":"class"; // className for IE & class for Mozilla
  8.   for(var k=0;k<all.length;k++) 
  9.     if(all[k].getAttribute(att) == className) 
  10.       arr[arr.length] = all[k]; 
  11.   return arr 
  12. }
Code :
  1. function setClassName(id,cla)
  2. {
  3.     var att = (document.all)?"className":"class"; // className for IE & class for Mozilla
  4.     document.getElementById(id).setAttribute(att,cla);
  5.    
  6. }


---------------
Nos estans firs di nosse pitite patreye...
n°1065492
cerel
Posté le 29-04-2005 à 11:33:22  profilanswer
 

Ca fonctionne avec les elements qui ont plusieurs classes ??


Message édité par cerel le 29-04-2005 à 11:33:34
mood
Publicité
Posté le 29-04-2005 à 11:33:22  profilanswer
 

n°1065495
KangOl
Profil : pointeur
Posté le 29-04-2005 à 11:38:52  profilanswer
 

j'ai pas testé...
 
getAttribute renverrai donc un tableau ??


---------------
Nos estans firs di nosse pitite patreye...
n°1065500
KangOl
Profil : pointeur
Posté le 29-04-2005 à 11:43:39  profilanswer
 

et non, getAttribute renvoi exactement la string du class, donc toutes les classe séparée par des espaces...
 
ca existe "explode" en javascript ??


---------------
Nos estans firs di nosse pitite patreye...
n°1065601
KangOl
Profil : pointeur
Posté le 29-04-2005 à 12:39:58  profilanswer
 

allez hop

// leave container arg out, and will default to document.  
// code from http://www.webmasterworld.com/forum91/1757.htm (unbugged)
// 050429: now also work with multi class elements.
function getElementsByClassName(className,container)
{  
  container = container||document ;  
  var all = container.all||container.getElementsByTagName('*');  
  var arr = [] ;
  var cla = [] ; var tmp;
  var att = (document.all)?"className":"class"; // className for IE & class for Mozilla
   
  for(var k=0;k<all.length;k++)
  {
    tmp = all[k].getAttribute(att);
    if(!tmp) continue;
    cla = tmp.split(" " );
 
    for(var l=0;l<cla.length;l++)
    {
      if(cla[l] == className)
      {
          arr[arr.length] = all[k];
   break;
      }
    }
  }
  return arr
}


---------------
Nos estans firs di nosse pitite patreye...
n°1065758
masklinn
í dag viðrar vel til loftárása
Posté le 29-04-2005 à 14:35:41  profilanswer
 

document.getElementsByClass = function (needle, tag) {
    if(!tag)
        tag="*"
    var my_array = document.getElementsByTagName(tag);
    var retvalue = new Array();
    var i;
    var j;
 
    for (i = 0, j = 0; i < my_array.length; i++)
    {
        var c = " " + my_array[i].className + " ";
        if (c.indexOf(" " + needle + " " ) != -1)
            retvalue[j++] = my_array[i];
    }
    return retvalue;
}


:o


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1065769
KangOl
Profil : pointeur
Posté le 29-04-2005 à 14:42:04  profilanswer
 

j'ai encore bcp a apprendre en optimisation [:matleflou]


---------------
Nos estans firs di nosse pitite patreye...
n°1065780
masklinn
í dag viðrar vel til loftárása
Posté le 29-04-2005 à 14:45:40  profilanswer
 

C'est pas complètement de moi (j'ai juste optimisé pour ajouter un tag optionnel en plus de la classe), ça vient du Glazblog
Il y a des versions largement plus avancées, mais non fonctionnelles sous MSIE


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1069078
gatsusat
Posté le 02-05-2005 à 17:53:13  profilanswer
 

juste petite information :  
 
la pseudo classe ":hover" ne fonctionne qu'avec l'attribut A sous IE, sous les autres navigateurs (FF, Opera..) ca fonctionne avec presque tout.
 
Si je dis une bêtise fouettez moi

n°1069082
masklinn
í dag viðrar vel til loftárása
Posté le 02-05-2005 à 17:58:03  profilanswer
 

gatsusat a écrit :

juste petite information :  
 
la pseudo classe ":hover" ne fonctionne qu'avec l'attribut A sous IE, sous les autres navigateurs (FF, Opera..) ca fonctionne avec presque tout.
 
Si je dis une bêtise fouettez moi


Nope, c'est exactement ça (mais un certain nombre de "patchs" en JS sont nés pour pallier à la chose)
(c'est d'ailleurs relativement simple à faire)


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1069191
FlorentG
Unité de Masse
Posté le 02-05-2005 à 19:13:56  profilanswer
 

Et si on est comme moi, on prend même pas la peine de mettre du JS :sol:

n°1069299
masklinn
í dag viðrar vel til loftárása
Posté le 02-05-2005 à 20:10:47  profilanswer
 

FlorentG a écrit :

Et si on est comme moi, on prend même pas la peine de mettre du JS :sol:


 http://rulzofpunk.free.fr/smileys/crashburn_fou.gif


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  css/javascript/firefox attribut hors standard

 

Sujets relatifs
[Reglé] Prob de tableaux sous IE (mais pas sous Firefox bien sur)Récupération de valeurs d'une bascule Javascript
[RESOLU][XSL/JavaScript]problème d'intégration code JS dans le XSL[Firefox] Ajouter un moteur de recherche d'un site dans le navigateur
JavaScript Popup vers son parentAppeler une fonction php avec du javascript
Lier Document XMl (Firefox)Problemes de tableaux sous Firefox
porte ouvert aux virus via javascript.Firefox ok --> IE pas ok
Plus de sujets relatifs à : css/javascript/firefox attribut hors standard


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR