Pesquisar no apoio

Evite burlas no apoio. Nunca iremos solicitar que telefone ou envie uma mensagem de texto para um número de telefone ou que partilhe informações pessoais. Por favor, reporte atividades suspeitas utilizando a opção "Reportar abuso".

Saber mais

Updating css rules within classes.

  • 1 resposta
  • 1 tem este problema
  • 2 visualizações
  • Última resposta por cor-el

more options

I am trying to use javascript to insert css rules within css classes. However I am only finding that my code only succeeds in prepending a new class and rule, while NOT inserting a new rule within a desired predefined css class. eg:

<style type="text/css">

a1.inner {
          position: relative;   
          display:  block;
          width:    100px;
          height:   100px;
          left:     -1px;
          top:      -1px; 
          border:   solid black 1px;
                
	 }

a2.outer {
          display:  block;
          width:    350px;
          height:   100px;  
          border:   solid black 1px;
          overflow: hidden;
         }

a3.inner {
          position: relative; 
          display:  block;
          width:    141.42px;
          height:   141.42px;
          left:     -1px;
          top:      -1px; 
          border:   solid black 1px;  
         }

a4.outer {
          display:  block;
          width:    100px;
          height:   100px; 
          border:   solid black 1px;
          overflow: hidden;
         }
</style>


document.styleSheets[0].insertRule('a1.inner{-moz-transform:rotate(45deg);}',cssRuleEndIndex);


How do I insert/read/update a new selector:value; rule in a specified css class? Is there a way to "create"/set/get css properties and values, within css classes, in a multiple platform way, particurly if css has already been defined in javascript or a css style block like this one?

I am trying to use javascript to insert css rules within css classes. However I am only finding that my code only succeeds in prepending a new class and rule, while NOT inserting a new rule within a desired predefined css class. eg:<br /> <br /> <pre><nowiki><style type="text/css"> a1.inner { position: relative; display: block; width: 100px; height: 100px; left: -1px; top: -1px; border: solid black 1px; } a2.outer { display: block; width: 350px; height: 100px; border: solid black 1px; overflow: hidden; } a3.inner { position: relative; display: block; width: 141.42px; height: 141.42px; left: -1px; top: -1px; border: solid black 1px; } a4.outer { display: block; width: 100px; height: 100px; border: solid black 1px; overflow: hidden; } </style> </nowiki></pre> <br /> <pre><nowiki>document.styleSheets[0].insertRule('a1.inner{-moz-transform:rotate(45deg);}',cssRuleEndIndex); </nowiki></pre> <br /> How do I insert/read/update a new selector:value; rule in a specified css class? Is there a way to "create"/set/get css properties and values, within css classes, in a multiple platform way, particurly if css has already been defined in javascript or a css style block like this one?

Modificado por cor-el a

Todas as respostas (1)

more options

You probably need to add a new stylesheet with that rule after the last stylesheet.


A good place to ask questions and advice about web development is at the mozillaZine Web Development/Standards Evangelism forum.
The helpers at that forum are more knowledgeable about web development issues.
You need to register at the mozillaZine forum site in order to post at that forum.

See http://forums.mozillazine.org/viewforum.php?f=25