Новости Joomla

0 Пользователей и 1 Гость просматривают эту тему.
  • 1 Ответов
  • 2083 Просмотров
*

vicemax

  • Новичок
  • 8
  • 2 / 0
кеширование rollover
« : 14.12.2007, 16:36:37 »
Сделал меню. При наведении на ссылку меняеться картинка. Сделано с помощью rollover. Как сделать чтобы при загрузке шаблона сразу кешировалась картинка (которая появляеться при наведении). Проблема просто в том, что при наведении начинаеться загрузка картинки и получаеться задержка и серый фон, а после загрузки картинки уже нормально.

Вот ссылка: www.old-sound.ru
*

one_more

  • Захожу иногда
  • 139
  • 87 / 3
  • there is no spoon
Re: кеширование rollover
« Ответ #1 : 15.12.2007, 21:04:32 »
Во-первых, rollover'ы можно делать разными способами: можно в css "двигать" полную картинку, можно её в css "подменять" по a:link -> a:hover, а можно делать подмену JavaScript'ом по событию onMouseOver. Поэтому "делаю с помощью rollover" не говорит ничего.

Во вторых. Если Вы не хотите картинку "двигать" в css (что, ИМХО, вариант лучший и работающий независимо от включения/выключения JavaScript etc), предзагрузку картинок можно сделать JavaScript'ом. Примерно так: внутри head загружаете JavaScript с функцией предзагрузки, а на событие onload элемента body вешаем вызов самой функции. Пример ниже:

Код
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Preloading of images</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_preloadImages() {
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
</script>
</head>
<body onload="MM_preloadImages('/templates/template_name/images/first.gif','/templates/template_name/images/second.gif')">

</body>
</html>
« Последнее редактирование: 15.12.2007, 21:11:53 от one_more »
Errare humanum est
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться