Работа скрипта в Opera и Firefox
На странице есть такой код:
[HTML]<script>
function Show(ident){
s=document.getElementById(ident).background = "res/Back.png";
}
function Hide(ident){
s=document.getElementById(ident).background = null;
}
</script>
<td id="img2" onMouseOver="Show('img2');" onMouseOut="Hide('img2');">some text</td>[/HTML]так вот в IE он прекрасно работает и картинка в фоне ячейки отображается, а вот в Opera и Firefox нет и фон остаётся пустым. Как поправить это дело?
[HTML]<script>
function Show(ident){
s=document.getElementById(ident).background = "res/Back.png";
}
function Hide(ident){
s=document.getElementById(ident).background = null;
}
</script>
<td id="img2" onMouseOver="Show('img2');" onMouseOut="Hide('img2');">some text</td>[/HTML]так вот в IE он прекрасно работает и картинка в фоне ячейки отображается, а вот в Opera и Firefox нет и фон остаётся пустым. Как поправить это дело?
Потому что вы неправильно используете элементы (структуру).
[HTML]
<script>
function Show(ident){
s=document.getElementById(ident).backgroundImage = "res/Back.png";
}
function Hide(ident){
s=document.getElementById(ident).backgroundImage = null;
}
</script>
<td id="img2" onMouseOver="Show('img2');" onMouseOut="Hide('img2');">some text</td>[/HTML]
или так:
[HTML]
<script>
function Show(ident){
s=document.getElementById(ident).style.backgroundImage = "res/Back.png";
}
function Hide(ident){
s=document.getElementById(ident).style.backgroundImage = null;
}
</script>
<td id="img2" onMouseOver="Show('img2');" onMouseOut="Hide('img2');">some text</td>[/HTML]
[HTML]
<script>
function Show(ident){
s=document.getElementById(ident).backgroundImage = "res/Back.png";
}
function Hide(ident){
s=document.getElementById(ident).backgroundImage = null;
}
</script>
<td id="img2" onMouseOver="Show('img2');" onMouseOut="Hide('img2');">some text</td>[/HTML]
или так:
[HTML]
<script>
function Show(ident){
s=document.getElementById(ident).style.backgroundImage = "res/Back.png";
}
function Hide(ident){
s=document.getElementById(ident).style.backgroundImage = null;
}
</script>
<td id="img2" onMouseOver="Show('img2');" onMouseOut="Hide('img2');">some text</td>[/HTML]
Проверил. Не работает. Теперь уже и под Ослом:(
Цитата: InoY
Проверил. Не работает. Теперь уже и под Ослом:(
Извиняюсь. Забирайте:
Должно.
[HTML]
<script>
function Show(ident){
ident.style.backgroundImage = "url('res/Back.png')";
}
function Hide(ident){
ident.style.backgroundImage = "";
}
</script>
<table><tr><td id="img2" onMouseOver="Show(this);" onMouseOut="Hide(this);">some text</td></tr></table>
[/HTML]
Спасибо. Всё работает.:D
А можешь объяснить, мне для общего развития так сказать, почему не работало? (Всё что я знаю я на учился сам почти без помощи интернетов, поэтому прошу сложными терминами не кидаться и объяснить на пальцах)
А можешь объяснить, мне для общего развития так сказать, почему не работало? (Всё что я знаю я на учился сам почти без помощи интернетов, поэтому прошу сложными терминами не кидаться и объяснить на пальцах)
1. <td> bla-bla-bla</td> НЕ МОЖЕТ существовать без <table><tr></tr></table> и ОБЯЗАТЕЛНЬО ВНУТРИ НИХ (изучи инфу "Таблицы html")
2. Ты неправильно обращался к свойствам CSS. Пропустил слово style и неправильно обратился к свойству бэкграунда.
По-этому первое, что тебе нужно прочитать\изучить: http://htmlbook.ru/ (я сам нуп, тоже пользуюсь).
З.Ы. "Спасибо" принимаются в "репу" (значок весов внизу слева)
2. Ты неправильно обращался к свойствам CSS. Пропустил слово style и неправильно обратился к свойству бэкграунда.
По-этому первое, что тебе нужно прочитать\изучить: http://htmlbook.ru/ (я сам нуп, тоже пользуюсь).
З.Ы. "Спасибо" принимаются в "репу" (значок весов внизу слева)
Бэкграунд ставится через url('xxx') только, иначе не работает. Стоило лишь почитать ман по CSS. Там описано, какие значения должны быть у параметров.
Посчет <td> - тут в целом пох, работать должно. В рамках стандрата, конечно, не верно, ну для вашего примера норм. Имхо, надо было лишь гуглить нормально
Посчет <td> - тут в целом пох, работать должно. В рамках стандрата, конечно, не верно, ну для вашего примера норм. Имхо, надо было лишь гуглить нормально
Цитата: Kesano
1. <td> bla-bla-bla</td> НЕ МОЖЕТ существовать без <table><tr></tr></table> и ОБЯЗАТЕЛНЬО ВНУТРИ НИХ
Эти тэги я опустил, чтобы не засорять сообщение и оставил самую суть. Я в HTML нуб из нубов, но не настолько же!:)
Цитата: UAS
Бэкграунд ставится через url('xxx') только, иначе не работает. Стоило лишь почитать ман по CSS. Там описано, какие значения должны быть у параметров.
В этой строчке
Код:
document.getElementById(ident).background
Кстати, для такой ерунды я бы использовал исключительно ЦСС...
[HTML]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<style type="text/css">
.host { width: 200px; height:30px; background-color:#FFAABB;}
.host:hover{ background-image:url(http://www.google.com.ua/images/srpr/nav_logo14.png); }
</style>
<table><tr><td class="host">test</td></tr></table>
[/HTML]
ВАЖНО! ДОКТАЙП ДОЛЖЕН БЫТЬ УКАЗАН. БЕЗ НЕГО ЦСС:ховер НЕ РАБОТАЕТ
[HTML]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<style type="text/css">
.host { width: 200px; height:30px; background-color:#FFAABB;}
.host:hover{ background-image:url(http://www.google.com.ua/images/srpr/nav_logo14.png); }
</style>
<table><tr><td class="host">test</td></tr></table>
[/HTML]
ВАЖНО! ДОКТАЙП ДОЛЖЕН БЫТЬ УКАЗАН. БЕЗ НЕГО ЦСС:ховер НЕ РАБОТАЕТ