|
|
|
| Вот столкнулся с такой необходимостью, нужно иметь возможность менять фон ячейки, нашел такой скрипт
<html>
<META http-equiv=Content-Type content="text/html; Charset=windows-1251">
<head>
<style>
td.mytd {background-color: red}
td.mytd2 {background-color:#567431}
</style>
<script language="">
function over(obj) {
obj.className = "mytd";
}
function out(obj) {
obj.className = "mytd2";
}
</script>
</head>
<body>
<table border="1">
<tr>
<td class=mytd2 onmouseover="over(this)" onmouseout="out(this)">ля-ля-ля</td>
<td>kz-kz-lz </td>
</tr>
</table>
|
НО мне нужно больше двух цветов! Вот в чём вопрос .
Подскажите, кто знает, как можно присобачить сюда ещё пару цветов.
И лучше переключать их щелчками мыши или ссылкой или кнопками там. | |
|
|
|
|
автор: Guest (19.10.2005 в 17:52) |
|
|
для: Sasha
(19.10.2005 в 17:41)
| | И в чем проблема? Настолько плохо с ручками? Занесите в массив имена классов CSS и перебирайте их инкрементируя глобальную переменную. | |
|
|
|
|
|
|
|
для: Guest
(19.10.2005 в 17:52)
| | занести в масив то можно, а вот перебирать не получается.
> и перебирайте их инкрементируя глобальную переменную.
а можно эту строчку в виде кода написать? :) | |
|
|
|
|
автор: Guest (19.10.2005 в 19:36) |
|
|
для: Sasha
(19.10.2005 в 19:23)
| | var incs = 0;
var arr = new array();
arr[ 0 ] = "style_name_1";
arr[ 1 ] = "style_name_2";
arr[ 2 ] = "style_name_3";
Далее по тексту скрипта, только в качестве имени класса CSS подставлять значение массива так:
obj.className = arr[ incs++ ];
Ну и предварительно проверять - не выходит ли переменная за диапазон массива, если выходит - обнулять! | |
|
|
|
|
|
|
|
для: Guest
(19.10.2005 в 19:36)
| |
<head>
<style>
td.mytd {background-color: red}
td.mytd2 {background-color:#567431}
td.mytd3 {background-color:black}
</style>
<script language="">
var incs = 0;
var arr = new array();
arr[ 0 ] = "td.mytd";
arr[ 1 ] = "td.mytd2";
arr[ 2 ] = "td.mytd3";
function over(obj) {
obj.className = arr[ incs++ ];
}
function out(obj) {
obj.className = arr[ incs++ ];
}
</script>
</head>
<body>
<table border="1">
<tr>
<td class=arr[ incs++ ]; onmouseover="over(this)" >ля-ля-ля</td>
<td>kz-kz-lz </td>
</tr>
</table>
|
Что то не работает :((( | |
|
|
|
|
автор: Guest (19.10.2005 в 22:53) |
|
|
для: Sasha
(19.10.2005 в 20:47)
| | Ну в данном случае надо записывать только имя стиля, без имени тега. Браузер уж сам, благодаря DOM разберется, что куда ставят, так что в массив заносите только имена классов : mytd, mytd2 etc.. Если непонятно напишу работающий скрипт, но только завтра! Устроит? | |
|
|
|
|
|
|
|
для: Guest
(19.10.2005 в 22:53)
| | Вопрос ещё актуален.... | |
|
|
|
|
|
|
|
для: Sasha
(21.10.2005 в 00:32)
| |
<td bgcolor=#6288a2 onMouseOver="this.setAttribute('bgcolor','#456275',0);" onMouseOut="this.setAttribute('bgcolor','#6288a2',0);">
|
| |
|
|
|
|
|
|
|
для: Евгений Петров
(21.10.2005 в 01:33)
| | А как прикрутить другие цвета?
В том и соль, что надо больше двух цветов! | |
|
|
|
|
|
|
|
для: Sasha
(21.10.2005 в 09:25)
| | Просто беда какаято. Нашёл кучу скриптов для смены фона страницы, но ни один не могу приспособить для смены фона ячейки...
вот например прикольный скрипт
<FORM>
<SELECT Size=5 name=clr onChange="document.bgColor=this.options[this.selectedIndex].value">
<OPTION VALUE="blue">blue
<OPTION VALUE="aquamarine">aquamarine
<OPTION VALUE="chocolate">chocolate
<OPTION VALUE="darkred">dark red
<OPTION VALUE="gold">gold
<OPTION VALUE="red">red
<OPTION VALUE="yellow">yellow
<OPTION VALUE="hotpink">hotpink
<OPTION VALUE="lime">lime
<OPTION VALUE="darkkhaki">dark khaki
<OPTION VALUE="cadetblue ">cadet blue
<OPTION VALUE="darkgoldenrod">dark goldenrod
<OPTION VALUE="darkslateblue">dark slate
<OPTION VALUE="blue">blue
<OPTION VALUE="deeppink">deep pink
<OPTION VALUE="darksalmon">dark salmon
<OPTION VALUE="salmon">salmon
<OPTION VALUE="tan">tan
<OPTION VALUE="wheat">wheat
<OPTION VALUE="tomato">tomato
<OPTION VALUE="springgreen">springgreen
<OPTION VALUE="turquoise">turquoise
<OPTION VALUE="white" SELECTED>White
</SELECT>
</FORM>
|
Не подскажите, его можно приспособить для смены фона ячейки таблицы???? | |
|
|
|
|
|
|
|
для: Sasha
(22.10.2005 в 22:18)
| | Вместо document.bgColor писать document.all.id_имя_ячейки_таблицы.style.backgroundColor.
А если надо менять фон "по кругу", то как писал Guest, надо проходить этот круг по шагу при каждом событии.
<td class=arr[ incs++ ]; - некорректно, здесь вам html, а не JS ;) А вообще, зачем через класс, если можно менять только backgroundColor ? В результате реализация идеи занимает немного: (оно трудночитаемо, но компактно)
<script>nBgC=-1;A=['red','blue','yellow'];</script>
<table border=1><tr onMouseOver=this.bgColor=A[++nBgC==A.length?nBgC=0:nBgC] onMouseOut=this.bgColor=''>
<td>Содержимое.</td></tr></table>
| Если надо поставить больше цветов, просто удлиняете список. | |
|
|
|
|
|
|
|
для: 12345
(22.10.2005 в 23:56)
| | Вот это дело!!! И работает везде.
Большое спасибо за помощь! | |
|
|
|
|
|
|
|
для: Sasha
(23.10.2005 в 00:15)
| | С одним "но": если в ячейке другой объект кроме простого текста (например <b>....</b>), он зкранирует фон ячейки и вся красота портится.
Это уже сойдёт как некое конкурсное задание: кто сделает совершенно корректное включение фона ячейки с элементами внутри неё при наведении мыши? То, что я сделал ниже, работает при небыстром движении. При быстром некоторые события пропадают и фон остаётся включённым. Видимо, надо обрамляющий документ задействовать - если придёт Over, выключать фон. Или вешать слой над ячейкой, что не будет практично при наличии текста со ссылками в ячейке. Наконец, каждый элемент (тег) в ячейке так описывать - накладно, хорошо бы придумать общую модель со всплывающими событиями и предусмотреть, что таких ячеек, которые надо включать, несколько. (И это всё - от пропуска событий при быстром движении мыши.)
<script>d=document;nBgC=-1;A=['red','blue','yellow'];cover=ww1=ww2=0;</script>
<table border=1 cellpadding=2><tr id=cell
onMouseOver=clearTimeout(ww2);if(cover==0)ww=setTimeout("d.all.cell.bgColor=A[++nBgC==A.length?nBgC=0:nBgC]",199);cover=0;
onMouseOut=ww1=setTimeout("d.all.cell.bgColor=''",99);>
<td><b onMouseOver=event.cancelBubble=!0;clearTimeout(ww1)
onMouseOut=event.cancelBubble=!0;cover=1;ww2=setTimeout("cover=0;d.all.cell.bgColor=''",99);>
Содержимое.
</b></td></tr></table>
|
| |
|
|
|