Изменнение размеров блоков при наведение
Здравствуйте! Не работает jQuery скрипт, а именно:
При наведение на блок с id "zoom", он увеличивается (+показывается скрытый в нем (display: none) текст), но срабатывает скрипт, почему то, только на первом блоке! А все остальные как будто бы с другим id Вот код скрипт:
$(function(){
$('#zoom').hover(function(){
$(this).stop().animate({width:"130px",height:"130px",left:"-40px",top:"-40px"}, 400);
$(this).find('p').fadeIn("slow");
},
function(){
$(this).stop().animate({width:"50px",height:"50px",left:"0",top:"0"}, 400);
$(this).find('p').css('display','none');
});
});
И часть HTML кода: <div id="menu"> <div id="zoom"><p>Меню</p></div> <div id="zoom"><p>Меню</p></div> </div> <div id="menu"> <div id="zoom"><p>Меню</p></div> <div id="zoom"><p>Меню</p></div> </div> |
More916,
Id - по определению считается уникальным элементом на странице - второе даже не ищецо Используйте class
<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>
<style type="text/css">
.menu {
border:red solid 1px;
}
.zoom {
border:blue solid 1px;
}
</style>
<script type="text/javascript">
$(function(){
$('.zoom').hover(function(){
$(this).stop().animate({width:"130px",height:"130px",left:"-40px",top:"-40px"}, 400);
$(this).find('p').fadeIn("slow");
},
function(){
$(this).stop().animate({width:"50px",height:"50px",left:"0",top:"0"}, 400);
$(this).find('p').css('display','none');
});
});
</script>
<div class="menu">
<div class="zoom"><p>Меню</p></div>
<div class="zoom"><p>Меню</p></div>
</div>
<div class="menu">
<div class="zoom"><p>Меню</p></div>
<div class="zoom"><p>Меню</p></div>
</div>
|
Благодарю, все заработало (а ведь все верно, в исходнике, из которого я взял скрипт увеличения, были именно классы а не id)
|
Добрый кто подскажет. Интересует подобное но.
Допустим есть блока по 2 в ряд. При наведении мышки на один Он увеличивается ( пусть будет 20px "ш\в") три блока в свою очередь уменьшаются. Спасибо |
Здравствуйте
а как сделать похожее...но чтоб блок наезжал на другие...а не сдвигался.
Вот сейчас так: http://www.obo-v-sem.ru/billing/ А нужно : http://www.obo-v-sem.ru/svet/istochn...-svetodiodnye/ |
| Часовой пояс GMT +3, время: 10:21. |