VPF::ScrollBar на javascript и все это под FF - Форум программистов

Sanek123

Дата 26.2.2009, 19:20 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 201
Регистрация: 22.10.2008

Репутация: нет
Всего: нет

Вздумалось собрать скролбар на javascript, и никак без вопросов:
1 Не работает прокручивалка в Mozilla, и возможно в Opera тоже (не пробовал). Может команды под мозилой пишутся иначе?
2 Какое событие возникает при прокрутке колеса мыши, и как отловить куда оно крутиться: вверх или вниз.

Код


<html>

<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title></title>

<script>
<!--
var scroll=0;

function scrollUp(name) {
    if (e = document.getElementById(name)) {
        mt = parseInt(e.style.marginTop);
        if (mt < 0) e.style.marginTop = (mt + 30) + 'px';
    }
}

function scrollDown(name) {
    if (e = document.getElementById(name)) {
        mt = parseInt(e.style.marginTop);
        if (e.offsetHeight + mt >= 375) e.style.marginTop = (mt - 30) + 'px';
    }
}

function mover()
{
if (scroll!=0)
{
scroller.style.top=window.event.clientY - 50;
}
}

function yes()
{
scroll=1;
}

function no()
{
scroll=0;
}

</script>

</head>

<body>


<div id="scroller" style="border:1px solid #000000; visibility:visible; position:absolute; left:557px; top:32px; width:15px; height:169px; background-color:'#CCCCCC'; padding:3px; z-Index:18"
onmousemove="mover();" onmousedown="yes();" onmouseup="no();" onmouseout="no(); ">
</div>
        <div style=" overflow: hidden; border-style:solid; border-width:1px; position: absolute; width: 548px; height: 375px; margin-left: 0px; margin-top: -4px; z-index:7; margin-right:0px; margin-bottom:0px">
            <div id="content" style="margin-top: 0px; margin-left: 10px; margin-right: 10px; ">
                
<p align="justify">
  <font color="darkgray" size="1" face="Arial">

 Здесь предполагается много-много текста...

    </font> 
<p> 

                
            </div>
        </div>

<div style="position: absolute; cursor: default; width: 15px; height: 21px; z-index: 5; left: 557px; top: 11px; border-style: solid; border-width: 1px; background-color:#CCCCCC" id="layer1"
onclick="scrollUp('content'); this.blur(); return false; javascript:void(0);">
</div>

<div style="position: absolute; cursor: default; width: 15px; height: 21px; z-index: 5; left: 557px; top: 365px; border-style: solid; border-width: 1px; background-color:#CCCCCC" id="layer2"
onclick="scrollDown('content'); this.blur(); return false; javascript:void(0);">

</div>


<div style="position: absolute; cursor: default; width: 562px; height: 375px; z-index: 1; left: 10px; top: 11px; border-style: solid; border-width: 1px; background-color: #FFFFFF" id="layer3">
&nbsp;</div>


</body>

</html>

Может кто что-нибудь подскажет.

Это сообщение отредактировал(а) Sanek123 - 26.2.2009, 19:22

--------------------

Вас разыскивают бойцы 139-го порта...

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »