Знатокам js

Главные вкладки

digital_sword 23 августа 2009 в 16:16

Использую вот такой код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"><head>

<meta http-equiv="X-UA-Compatible" content="IE=7"/>

<meta http-equiv="Content-Type" content="text/html"; charset="utf-8" />

<title>MENU</title>

<script src="1/js/jquery-1.3.2.min.js" type="text/javascript"></script>

<script type="text/javascript">

$(function(){

    $('.menu').find('li').hover(

        function(){

            $('#prevew').html($(this).find('img').clone().css({'display':'inline'}));

            $('.menu').find('li').css({'background':'none'});

            $(this).css({/*здесь стили для li:hover*/ 'background':'red'});

        },

        function(){

            $(this).css({});

        }

    );

});

</script>

<style type="text/css">

    .prevew{height:200px; padding:20px;}

    .prevew img{height:200px; }

</style>

</head><body>

    <ul class="menu">

        <li><a href="#">link1</a><img src="http://1.rus/1/images/1.jpg" style="display:none" /></li>

        <li><a href="#">link2</a><img src="/1/images/2.jpg" style="display:none" /></li>

        <li><a href="#">link3</a><img src="/1/images/3.jpg" style="display:none" /></li>

    </ul>

    <div id="prevew" class="prevew"></div>

    <ul class="menu">

        <li><a href="#">link4</a><img src="/1/images/4.jpg" style="display:none" /></li>

        <li><a href="#">link5</a><img src="/1/images/5.jpg" style="display:none" /></li>

        <li><a href="#">link6</a><img src="/1/images/6.jpg" style="display:none" /></li>

    </ul>

</body></html>

для решения задачи:

Наводишь на другую ссылку - рисунок меняется... Вроде нормально, но я не очень-то разобрался.

из-за чего может не работать?

Drupal6

Drupal Drupal на русском

Знатокам js

Главные вкладки

Комментарии