Показать сообщение отдельно
  #1 (permalink)  
Старый 16.06.2010, 13:02
Новичок на форуме
Отправить личное сообщение для -user21- Посмотреть профиль Найти все сообщения от -user21-
 
Регистрация: 09.06.2010
Сообщений: 5

Проблема скрипта карусели в firefox. Очень прошу помощи.
Добрый день.

Есть скрипт карусели основанный на JQuery и СSS

Выложил тут: http://store-cd.spb.ru/
В IE и Opera все ок
Лиса же вымотала всю душу.
Не работает mouseout
Когда мышь уходит за пределы рабочего div поле должно уменьшать свою ширину с 1500px до 457px. Таким образом происходит возврат карусели в начало. В лисе это не фурычит.
Сам лапоть, подскажите где копать?

<script src="jquery.min.js" type="text/javascript"></script>
<style type="text/css">

div.sc_menu {
	/* Set it so we could calculate the offsetLeft */
	position: relative;
	height: 132px;
	width: 457px;
	overflow: auto;
}
ul.sc_menu {
	display: block;
	height: 110px;
	/* max width here, for users without javascript */	
	width: 1500px;	
	padding: 15px 0 0 15px; 
	/* removing default styling */
	margin: 0;
	background: url('navigation.png');		
	list-style: none;
}
.sc_menu li {
	display: block;
	float: left;	
	padding: 0 4px;
}
.sc_menu a {
	display: block;
	text-decoration: none;
}
.sc_menu span {
	display: none;
	margin-top: 3px;
	
	text-align: center;
	font-size: 12px;	
	color: #fff;
}
.sc_menu a:hover span {
	display: none;
}
.sc_menu img {
	border: 1px #fff solid;	
    height: 105px;
    margin-top: 5px;
}
.sc_menu a:hover img {
	filter:alpha(opacity=50);	
	opacity: 0.5;
}
</style>


<script type= "text/javascript">/*<![CDATA[*/
$(function(){
	//Get our elements for faster access and set overlay width
	var div = $('div.sc_menu'),
		ul = $('ul.sc_menu'),
                area = $('div.area'),
		ulPadding = 15;
	
	//Get menu width
	var divWidth = div.width();

	//Remove scrollbars	
	div.css({overflow: 'hidden'});
	
	//Find last image container
	var lastLi = ul.find('li:last-child');
	
	//When user move mouse over menu
	div.mousemove(function(e){
		ul.css({width: '1500'});
		var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + ulPadding;	
		var left = (e.pageX - div.offset().left) * (ulWidth-divWidth) / divWidth;
		div.scrollLeft(left);
	});
area.mouseover(function(){
    ul.css({width: '1500'});
 });

area.mouseout(function(){
    ul.css({width: '457'});
 });

});
/*]]>*/</script>
</head>


<body>
<div class='area'>
<div class="sc_menu">
	<ul class="sc_menu">

	    <li</li>
	    <li></li>
	    <li></li>
	    <li></		
            </ul>
</div>
</div>
Ответить с цитированием