Не нравятся результаты поиска? Попробуйте другой поиск!
dle-faq.ru FAQ (все вопросы) Общие вопросы по вёрстке Хак ленты новостей с прокруткой неверно отображается в mozilla firefox

Хак ленты новостей с прокруткой неверно отображается в mozilla firefox


     22.11.2012    Общие вопросы по вёрстке, Хаки    2634

вопрос
Хак ленты новостей с прокруткой неверно отображается в mozilla firefox.

должен быть (opera):
Хак ленты новостей с прокруткой неверно отображается в mozilla firefox

Есть (Mazilla):
Хак ленты новостей с прокруткой неверно отображается в mozilla firefox

css:
#lenta {
    display: block;
    width:1000px;
    height: 126px;
    white-space: nowrap;
    position:relative;
    overflow: hidden;

}
#lenta DIV { position:relative; white-space:nowrap; }
#lenta .left, #lenta .right { position:absolute; background:#000; display:block; height:140px; top:2px; opacity:.4; filter:alpha(opacity=40); }
#lenta .left IMG, #lenta .right IMG { border: none; margin: 60px 3px; }
#lenta .left { left:0px; text-align:right; }
#lenta .right { right:0px; }
#lenta_in { display:block; position:relative; left:0px; top:0px; }
#lenta IMG {padding:1px; border:1px solid #87c0dd;}
#lenta A { display: inline-block;  margin: 0px 1px; position: relative; text-decoration: none; }
#lenta A SPAN {left:2px; bottom:2px; font-weight:normal; font-family:tahoma; font-size:10px; color:#000000; position: absolute;  overflow: hidden; white-space:normal; display:none; padding:3px; width:80px; bottom:0px; left:0px; background:#ffffff; font-size: 11px; opacity:.8; filter:alpha(opacity=80); }
#lenta A:hover SPAN {left:2px; bottom:2px; font-weight:normal; font-family:tahoma; font-size:10px; color:#000000; display:block; }
#lenta A SPAN STRONG {left:2px; bottom:2px; font-weight:normal; font-family:tahoma; font-size:10px; color:#000000; display:block; }


lenta.tpl
<!-- LENTA--><div id="lenta">  
<SCRIPT language="javascript" type="text/javascript">  
<!--  
var carPos = 30;  
var t;  
var a;  
var kuda;  
function MoveMePlease(kuda) {  
if (kuda == 1) {  
document.getElementById('mr').style.width = '30px';  
if (carPos >= -984) {  
t=setTimeout("MoveMePlease(1)", 40);  
carPos=carPos-15;  
writer(carPos);  
} else { clearTimeout(t); }  
}  
else if (kuda == 0) {  
document.getElementById('ml').style.width = '30px';  
if (carPos <= -10) {  
a=setTimeout("MoveMePlease(0)", 40);  
carPos=carPos+15;  
writer(carPos);  
} else { clearTimeout(a); }  
}  
}  
function cleaner() { clearTimeout(a); clearTimeout(t);  
document.getElementById('mr').style.width = ''; document.getElementById('ml').style.width = '';  
}  
function writer(newPos) { document.getElementById('lenta_in').style.left = newPos+'px'; }  
-->  
</SCRIPT>  


<div id="lenta_in">  

блаблабла <-- ссылки и картинки новостей

</div>  
<DIV onmouseover="MoveMePlease(1)" onmouseout="cleaner()" id="mr" class="right">
<IMG src="/uploads/thumbs/move_right.gif" alt="прокрутить вправо" /></DIV>
<DIV onmouseover="MoveMePlease(0)" onmouseout="cleaner()" id="ml" class="left">
<IMG src="/uploads/thumbs/move_left.gif" alt="прокрутить влево" /></DIV>
<!-- LENTA -->


как сделать чтобы в Мазиле отображалось, как и в Опере?
з.ы. Мой сайт лежит на Денвере, поэтому примером будет один из сайтов, который я нашел в сети: kinodisk . net

Ответил: ПафНутиЙ


Firefox не поддерживает position:relative в таблицах.
Избавьтесь от таблицы и всё будет ок. Тем более правильнее подобные конструкции делать на ненумерованных списках.

Комментарии пользователей (1)

Warlog
5 | 2

Warlog - 22 ноября 2012 19:55 - Юзер

Я ничего в этом не смыслю. Может кто-нибудь переделать с учетом ответа Пафнутия?

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы