style switcher
18.06.2009, 15:52 | ||
При нажатии на кнопку, подсвечивает текст ----------------------------------------------------------------- Пример использования скрипта: :( ----------------------------------------------------------------- Код скрипта: Вставьте следующий код между тегами <BODY></BODY> <p> <small>»» <a href="switchStyle.html" onclick="switchStyle();return false;" title="Change foreground/background colors">Change foreground/background colors</a></small></p> <div class="textDefault"> <p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p></div> <div class="plain"> <p> Ma quande lingues coalesce, li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues.</p></div> <div class="textDefault"> <p> Epsum factorial non deposit quid pro quo hic escorol. Olypian quarrels et gorilla congolium sic ad nauseum. Souvlaki ignitus carborundum e pluribus unum. Defacto lingo est igpay atinlay.</p></div> Вставьте следующий код между тегами <HEAD></HEAD> <script type="text/javascript">function switchStyle(){ // return array of all DIV elements var divs = document.getElementsByTagName("DIV"); // Iterate through all DIVs in array for(var i = 0; i < divs.length; i++){ // If current DIV is using "textDefault" styling, // change it to use "textAlternate" styling if(divs[i].className == "textDefault") divs[i].className = "textAlternate"; // If current DIV is using "textAlternate" styling, // change it back to use "textDefault" styling else if(divs[i].className == "textAlternate") divs[i].className = "textDefault"; } } </script>
/* Styling common to both states (add extra styling as needed) */ .textDefault, .textAlternate { padding: 10px; width: 300px; } /* Styling for the default state (add extra styling as needed) */ .textDefault { background-color: #fff; color: #000099; border: #000; } /* Styling for the alternate state (add extra styling as needed) */ .textAlternate { background-color: #000099; color: #fff; font-weight: bold; } | ||
| ||
Просмотров: 464 | Загрузок: 0 | |
Всего комментариев: 0 | |