- 01
- 02
- 03
- 04
- 05
- 06
- 07
- 08
- 09
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
Здрасьте.
Есть самая верхняя строчка на странице, так сказать, самый верхный header. В ней на сайтах часто располагается контактная информация (телефоны, адреса, прочее), так вот, мне нужно сделать так, чтобы элементы <a><img></a> были видны лишь спустя сотку-две пикселей прокрутки. Я призадумалась, поискала и нашла такой код:
<?php function scroll_block(){
var stop = (document.body.scrollTop || document.documentElement.scrollTop);
var el=document.getElementById('menublock');
if(stop>150){
if(el.style.display!='block'){
el.style.display='block';
}
}
else
el.style.none='none';
return false;
}
if (window.addEventListener){
window.addEventListener("scroll", scroll_block, false);
window.addEventListener("load", scroll_block, false);
}
else if (window.attachEvent){
window.attachEvent("onscroll", scroll_block);
window.attachEvent("onload", scroll_block);
}
<div id='menublock' style="display:none">а тут меню</div>
?>
Затем я подумала, и теперь сделала сам элемент:
<div id="hideousvar"> <a href="http://dev.zoldol.ru/vremya-raboty-sklonov"> <img class="varhid" style="padding: 0px 5px 12px 5px;height: 25px;" title="Время работы склонов" alt="" src="http://dev.zoldol.ru/wp-content/themes/subway-child/images/clock.png"></a>
<a href="http://dev.zoldol.ru/webcamera"> <img class="varhid" style="padding: 0px 5px 10px 5px;height: 28px;" title="WEB-камера" alt="" src="http://dev.zoldol.ru/wp-content/themes/subway-child/images/camera.png"></a>
<a href="http://dev.zoldol.ru/3d-tour"> <img class="varhid" style="padding: 0px 0px 5px 0px;height: 35px;" title="3D-тур" alt="" src="http://dev.zoldol.ru/wp-content/themes/subway-child/images/tour.png"></a>
<a href="http://dev.zoldol.ru/scheme"> <img class="varhid" style="padding: 0px 5px 13px 5px; height: 24px;" title="Интерактивная карта склона" alt="" src="http://dev.zoldol.ru/wp-content/themes/subway-child/images/map.png"></a> </div>
Функция:
<?php function scroll_block(){ var stop = (document.body.scrollTop || document.documentElement.scrollTop); var el=document.getElementById('hideousvar'); if(stop>150){ if(el.style.display!='block'){ el.style.display='block'; } } else el.style.none='none';
return false;
}
if (window.addEventListener){
window.addEventListener("scroll", scroll_block, false);
window.addEventListener("load", scroll_block, false);
}
else if (window.attachEvent){
window.attachEvent("onscroll", scroll_block);
window.attachEvent("onload", scroll_block);
}
<div id='hideousvar' style="display:none">а тут меню</div>
?>
Но что-то не сработало. Подскажите, пожалуйста. Буду безмерно благодарна за помощь.
Наткнулся на хешкоде на следующее чудо.
Хоть и топик тот, судя по всему, писала девушка, но всё ж, блин, с более-менее профессиональной моей точки зрения, это совсем ужас :D
Всё содержание топика точно скопипащено.:D