Как вернуть scrollBar на страницу.
Уесть такая страница.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <meta content="text/html; charset=window-1251" /> <title>Я Мерепещающаяся картинка!</title> <style> body{padding:0;margin:0;} #slidediv1{width:100%;height:100%;position: fixed;} .tdiv{position: fixed; width:300px; height:30px; background: rgba(0, 0, 0, 0.8); top:0; left:20px; color:#f99206;padding:5px;} .bdiv{position: fixed; width:300px; height:30px; background: rgba(0, 0, 0, 0.8); bottom:0; right:20px; color:#f1f1f1;padding:5px;} .newsdiv{position: fixed; width:300px; height:300px; background: rgba(0, 0, 0, 0.9); color:#f1f1f1;padding:5px; border-radius:10px 10px 10px 10px; border: 2px dashed #fff;margin:50px !important;} </style> </head> <body > <div id="slidediv1" style="background:url(https://pp.vk.me/c307514/v307514138/a569/7mb8m9F-JFQ.jpg);"></div> <div class="tdiv"><div align="center"><b>Картинка:</b> Небеса</div></div> <div class="bdiv"><div id="stop" style="float:left">Стоп</div><div id="down" style="float:left">Вниз</div><div id="scrolldown" style="float:left">Прокрутить Вниз</div></div> <div id="firstdiv"> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div></div> <script> function afun(divname,divarwidth){ document.getElementById('down').onclick=function(){flydown();} document.getElementById('stop').onclick=function(){clearInterval(s);} var position=''; var z=0; var l=0; var i=1; var e=document.getElementById(divname); var num=e.children.length; function flydown(){ var topdown=[screen.height/2 , screen.height/2+100+divarwidth]; while(i<num){ if(z==0){z=1;}else{z=0;} e.children[i].style.top=i*divarwidth+'px'; e.children[i].style.left=topdown[z]+'px';i++;}clearInterval(s); } if(screen.height>=720){ var topposition=[Math.floor(Math.random()*screen.height/6-100) , screen.height/2-100+Math.floor(Math.random()*80)]; while(i<num){ position+=(i*300+Math.floor(Math.random()*50))+Math.floor(Math.random()*screen.width/10); position+='^'; i++; }i=0; positionarry=position.split('^'); while(i<num){ pi=i-1; if(z==0){z=1;}else{z=0;} e.children[i].style.top=topposition[z]+50+'px'; e.children[i].style.left=positionarry[i]+'px';i++; } function animate(){ l++; while(i<num){ e.children[i].style.left=positionarry[i]-l+'px';i++; } i=0; }} else{flydown()} var s=setInterval(function(){animate();},50); } afun('firstdiv',300); </script> </body> </html>На которой плавно перемещаться div-ы с права налево. Так же есть кнопочка "Вниз" (После сделаю картинку) По которой все эти Div-ы выстраиваются в шамотном порядке сверху вниз. Но вот проблема. . . Нет СКРОЛИНГА! Есть всего одни идея. Но она не очень хорошая и я её приберёг на крайний случай. (Писать свой скролигл используя style.toр/left) |
[html run] допиши. А то нет кнопки Посмотреть
|
danik.js,
Всё =) |
Често говоря я не увидел шахматного порядка, тыкая на кнопку Вниз. И не понимаю какой скроллинг тебе нужен.
Проставь высоту через [html height=1000] |
:write:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <meta charset="utf-8"> <title>Я Мерепещающаяся картинка!</title> <style> body{padding:0;margin:0;} #slidediv1{width:100%;height:100%;position: fixed;} .tdiv{position: fixed; width:300px; height:30px; background: rgba(0, 0, 0, 0.8); top:0px; left:20px; color:#f99206;padding:5px;} .bdiv{position: fixed; width:300px; height:30px; background: rgba(0, 0, 0, 0.8); bottom:0; right:20px; color:#f1f1f1;padding:5px;} .newsdiv{position: absolute; width:300px; height:300px; background: #000000; color:#f1f1f1;padding:5px; border-radius:10px 10px 10px 10px; border: 2px dashed #fff;margin:50px !important;} #firstdiv{position: relative;} </style> </head> <body > <div id="slidediv1" style="background:url(file:///C:/Users/Rail-gun/Desktop/e9zca.jpg);"></div> <div class="tdiv"><div align="center"><b>Картинка:</b> Небеса</div></div> <div class="bdiv"><div id="stop" style="float:left">Стоп</div><div id="down" style="float:left">Вниз</div><div id="scrolldown" style="float:left">Прокрутить Вниз</div></div> <div id="firstdiv"> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div> <div class="newsdiv">Текст</div></div> <script> function afun(divname,divarwidth){ document.getElementById('down').onclick=function(){flydown();} document.getElementById('stop').onclick=function(){clearInterval(s);} var position=''; var z=0; var l=0; var i=1; var e=document.getElementById(divname); var num=e.children.length; function flydown(){ var topdown=[screen.height/2 , screen.height/2+100+divarwidth]; while(i<num){ if(z==0){z=1;}else{z=0;} e.children[i].style.top=i*divarwidth+'px'; e.children[i].style.left=topdown[z]+'px';i++;}clearInterval(s); } if(screen.height>=720){ var topposition=[Math.floor(Math.random()*screen.height/6-100) , screen.height/2-100+Math.floor(Math.random()*80)]; while(i<num){ position+=(i*300+Math.floor(Math.random()*50))+Math.floor(Math.random()*screen.width/10); position+='^'; i++; }i=0; positionarry=position.split('^'); while(i<num){ pi=i-1; if(z==0){z=1;}else{z=0;} e.children[i].style.top=topposition[z]+50+'px'; e.children[i].style.left=positionarry[i]+'px';i++; } function animate(){ l++; while(i<num){ e.children[i].style.left=positionarry[i]-l+'px';i++; } i=0; }} else{flydown()} var s=setInterval(function(){animate();},50); } afun('firstdiv',300); </script> </body> </html> |
рони,Вот спасибо. У меня не стразу ваш пост появился =)
Тогда написание своего скролла можно положить обратно в долгий ящик =) |
koeshiro,а что в примере выше скрола таки нет?
|
рони,
спасибо вам большое =) |
Часовой пояс GMT +3, время: 11:52. |