При наведении на картинку, появляется другая картинка - Форум « SHalbuz-Dag - Территория, исполнения заветных желаний!!!
Гость !!! | RSS
Сегодня на сайте
Новые сообщения Участники Правила форума Поиск RSS
Страница 1 из 11
Модератор форума: Khufu 
Форум » Скрипты » Эффекты..., трюки... » При наведении на картинку, появляется другая картинка
При наведении на картинку, появляется другая картинка
« Azzazil666 » Дата: Среда, 08 Сентябрь 2010, 00:55:40 | Сообщение # 1
Князь - Мира Сия
Azzazil666
«Администратор»
Сообщений: 416
Замечания: ±
Статус Настроения: [редактировать]
Отсутствует

Данные скрипты меняют одну картинку на другую при наведении курсора мышки.

Скрипт

Code
<script language="JavaScript">
<!--
v=parseInt(navigator.appVersion.substring(0,1))
function load(location){
return image;
}
if (v>=3){
tr=new Image();
tr.src="image.gif";
}
function show(where){
if (v>=3){
stored=where;
storedLocation=document.images[where].src;
document.images[where].src="image1.gif";
}
}
function hide(){
if (v>=3) document.images[stored].src=storedLocation;
}
//-->
</script>

В том месте, где необходимо - в тег a вписывается:
Code
<a href="index/46" onMouseOver="show('im1')" onMouseOut="hide()"><img src="image.gif" name="im1" height="30" width="30" border="0"></a>

Второй вариант

Скрипт

Code
<a href="index.htm" onMouseOver="document.myImage1.src='image1.gif'" onMouseOut="document.myImage1.src='image.gif'"><img src="image.gif" border="0" name="myImage1" width="30" height="30" alt=""></a>

Третий вариант служит для «подмены» нескольких разных картинок.

Скрипт

Code
<script language="JavaScript">
<!--
browserName = navigator.appName;
browserVer = parseInt(navigator.appVersion);
version = "old";
if (browserName == "Netscape" && browserVer >=3)
version = "new";
if (browserName == "Microsoft Internet Explorer" && browserVer >=4)
version = "new";
if (version == "new"){

toc1off = new Image(30,30);
toc1off.src = "image.gif";
toc1on = new Image(30, 30);
toc1on.src = "image1.gif";

toc2off = new Image(30, 30);
toc2off.src = "image.gif";
toc2on = new Image(30, 30);
toc2on.src = "image2.gif";

}
function img_act(imgName) {
if (version == "new") {
imgOn = eval(imgName + "on.src");
document [imgName].src = imgOn;
}
}
function img_inact(imgName) {
if (version == "new") {
imgOff = eval(imgName + "off.src");
document [imgName].src = imgOff;
}
}
//-->
</script>

В том месте, где необходимо - в тег a вписывается:
Code
<a href="index/36" onMouseover="img_act('toc1')" onMouseout="img_inact('toc1')">
<img src="image.gif" name="toc1" border="0" width="30" height="30" alt="">
</a>
<a href="index/47" onMouseover="img_act('toc2')" onMouseout="img_inact('toc2')">
<img src="image.gif" name="toc2" border="0" width="30" height="30" alt="">
</a>

В четвертом варианте подменяется картинка при наведении курсора мышки на другую из двух картинок.

Скрипт

Code
<script language="JavaScript">
<!--
browser_name = navigator.appName;
browser_version = parseFloat(navigator.appVersion);
if (browser_name == "Netscape" && browser_version >= 3.0)
{ roll = 'true'; }
else if (browser_name == "Microsoft Internet Explorer" && browser_version >= 3.0)
{ roll = 'true'; }
else { roll = 'false'; }
function over(img,ref) { if (roll == 'true') {
document.images[img].src = ref; } }
function out(img,ref) { if (roll == 'true') {
document.images[img].src = ref; }
}
//-->
</script>

В том месте, где необходимо - в тег a вписывается:
Code
<img src="image1.gif" name="ks" width="30" height="30" alt="">
<a href="index.htm" onMouseOver="over('ks','image3.gif');" onMouseOut="out('ks','image1.gif');">
<img src="image.gif" width="30" height="30" border="0" alt="">
</a>
<a href="index1.htm" onMouseOver="over('ks','image.gif');" onMouseOut="out('ks','image1.gif');">
<img src="image.gif" width="30" height="30" border="0" alt="">
</a>

Для того чтобы подмена картинок происходила без задержек, используют скрипт для предварительной загрузки изображений в кэш.

Скрипт

Code
<script language="JavaScript">
<!--
var browser = navigator.appName;
browser_version = parseFloat(navigator.appVersion);
var browser_ok = false;
if (browser == "Netscape" && browser_version >= 4.0)
browser_ok = 'true';
else if (browser == "Microsoft Internet Explorer" && browser_version >= 4.0)
browser_ok = 'true';
if (browser_ok == 'true') {
a1=new Image; a1.src="image.gif";
a2=new Image; a2.src="image1.gif";
a3=new Image; a3.src="image2.gif";
}
//-->
</script>

 
Форум » Скрипты » Эффекты..., трюки... » При наведении на картинку, появляется другая картинка
Страница 1 из 11
Поиск:
мини-чат
Tagis Балаболка
Инфо сайта
Инфо форума

Все права защищены! shalbuzdag-666.ucoz.ru © 2009 – 2016 ()
уЧётчик сайта