Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > Проблема движения предмета за скроллером

Автор: thefree 15.11.2007, 15:09

Есть div, кторый движется за скроллером с отступом от верха на 30px.
Но вот незадача он движется рывками, а хочется что бы он плавно передвигался за скроллером. Вот кусочек кода, помогите пожалуйста. Если можно с примером.

Код


<head>
<script type="text/javascript">

var topset = 30;

function makeMove() {
    var scrollTop;
    if (window.pageYOffset){
        scrollTop = window.pageYOffset;
    } else if(document.documentElement && document.documentElement.scrollTop){
        scrollTop = document.documentElement.scrollTop;
    } else if(document.body){ 
        scrollTop = document.body.scrollTop; 
    }
    if (scrollTop) {
        document.getElementById("frm").style.top = scrollTop + 30 + "px";
    }
    setTimeout("makeMove()", 25);
}

makeMove();
</script>
</head>

<body>
<div id="frm" style="top:30px; position:absolute; background-color:black">Test</div>
</body>

Автор: ksnk 15.11.2007, 15:36

в строке
if (scrollTop) {
смысловая ошибка. Ветка не сработает и в случае, если scrollTop==0, что, согласитесь, иногда тоже бывает smile

обычно, такие причуды делаются с помощъю style="position:fixed", правда, не без грязных ругательств с сторону богатства фантазии авторов броузеров...

за подробностями можно обратится, к примеру http://forum.dklab.ru/viewtopic.php?p=84006#84006

Автор: thefree 15.11.2007, 15:58

он у меня зафиксированный, надо избавится от рывков при движении.

В тот момент ему и не надо срабатывать, когда 0

Автор: thefree 15.11.2007, 21:12

вопрос решил.

Код


function makeMove() {
    var scrollTop, yfix;
    var fixy = 0;
    var frm[3] = 30;
    if (window.pageYOffset) {
        scrollTop = window.pageYOffset;
    } else if (document.documentElement && document.documentElement.scrollTop) {
        scrollTop = document.documentElement.scrollTop;
    } else if (document.body) {
        scrollTop = document.body.scrollTop; 
    }
    if (scrollTop != fixy && scrollTop > frm[3]) {
        yfix = .2 * (scrollTop - fixy + frm[3]);
    } else if (frm[3] + fixy > frm[3]) {
        yfix = .2 * (scrollTop + frm[3] - fixy);
    } else {
        yfix = 0;
    }
    if (yfix > 0) yfix = Math.ceil(yfix); else yfix = Math.floor(yfix);
    if (fixy > 0) { document.getElementById("frm").style.top = fixy + "px";    }
    fixy = fixy + yfix;
    setTimeout("makeMove()", delay*4);
}

Автор: ksnk 15.11.2007, 23:25

Цитата(thefree @ 15.11.2007, 21:12

)

вопрос решил.

точно? Код содержит синтаксические ошибки...

Не ясно что за мистическое число delay,
Смысл конструкции var frm[3] = 30; ускользает от моего понимания,
fixy используется излишне хитрым образом ... smile

Автор: thefree 15.11.2007, 23:37

Цитата(ksnk @ 15.11.2007, 23:25)

Цитата(thefree @ 15.11.2007, 21:12

)

вопрос решил.

так получилось что это кусок большого кода, плавающей меню.
delay = 10 по дефолту.

Автор: ksnk 16.11.2007, 00:09

Цитата(thefree @ 15.11.2007, 23:37

)

так получилось что это кусок большого кода, плавающей меню.

Хотите сказать, что это реально работающий код? В таком случае, смысл переменной fixy отсутствует напрочь, так как она при ходе в процедуру сразу обнуляется.
Смысл "var frm[3] = 30;" не понимаю не только я, но и FireFox вместе с эксплорером.

Автор: thefree 16.11.2007, 03:13

http://hz-portal.vassabi.ru/thefree/frmenu.js
Увидел на http://cs.rin.ru решил сделать у себя.
Идеи по оптимизации и более гибкой кроссплатформенности браузеров приветствуются.
Вызов:

Код


beginMenu("menu name, "<<"); // начало
addLink("test", "#", "_self"); //ссылка
addTitle("test"); //разделитель, титул.
addText("smile"); // вывод текста.
endMenu(); //the end ):

Автор: ksnk 16.11.2007, 09:42

Вообще-то генерировать что-то с помощью document.write не модно уже несколько лет, с тех пор как устаканились с DOM'ом.

Писать цвета прямо в тексте javascript еще менее модно, так как для этого есть классы. Достаточно представить себе, что на другом сайте у меню вполне может оказаться другой цвет

fix = setTimeout("null", 1000);
В этом чувствуется какая-то юниксовая сумашедшинка smile

А так - да, действительно работает smile