Injectați noi reguli CSS - CSS-Tricks

Anonim

Dacă trebuie să schimbați stilul unui element cu JavaScript, este de obicei mai bine să schimbați un nume de clasă și să faceți ca CSS deja în pagină să intre în vigoare și să schimbe stilul. Cu toate acestea, există excepții de la fiecare regulă. De exemplu, s-ar putea să doriți să schimbați pseudo-clasa (de exemplu :hover). Nu puteți face acest lucru prin JavaScript din același motiv style=""atributele inline nu pot schimba pseudo-clasele.

Va trebui să injectați un element nou pe pagină cu stilurile corecte. Cel mai bine este să-l injectați în partea de jos a paginii, astfel încât să înlocuiască CSS-ul deasupra acestuia. Ușor cu jQuery:

function injectStyles(rule) ( var div = $(" ", ( html: '-' + rule + '' )).appendTo("body"); )

Utilizare

injectStyles('a:hover ( color: red; )');

Demo

Mai multe informatii

  • Ciudățenii de injectare de stil în IE (Ryan Seddon).
  • Stack Overflow thread.