Probrem:
Sam scroll dziala, ale dic z tekstem mimo ze jest ograniczony wysokoscia do pewnej liczby rozciaga strone (PATRZ STRONA), choc tekstu nie pokzuje. Jak juz scrolluej do dolu to juz ten probrem (wsumie) znika. Nie mam pojecia jak to wywalic.
Kod nie jest moj, kapke go przepisalem orginal jest TUTAJ.

Teraz moj kod:
  1. <script type="text/javascript">
  2. /*
  3. Author: Krzysztof Szafranek
  4. */
  5. function scroller()
  6. {
  7. var clip_size=361
  8. var speed=5
  9. var d=document
  10. var sc=d.getElementById('div_text')
  11. var bar=d.getElementById('scrollbar')
  12. var buttonUp=d.getElementById('scrollup')
  13. var buttonDown=d.getElementById('scrolldown')
  14. var clip_top=10
  15. var bar_offset=0
  16. var div_text_top=sc.offsetTop
  17. var limit_top=buttonUp.offsetTop+buttonUp.offsetHeight
  18. var limit_bottom=buttonDown.offsetTop-bar.offsetHeight
  19. buttonUp.onmouseup=buttonDown.onmouseup=scrollStop
  20. buttonUp.onmousedown=buttonDown.onmousedown=scrollButton
  21. d.onmousemove=scrollBar
  22. d.onmouseup=cast
  23. bar.onmousedown=take
  24. bar.onselectstart=stop
  25.  
  26. function stop()
  27. {
  28. return false
  29. }
  30.  
  31. function scrollStop()
  32. {
  33. clearTimeout(sc.timer)
  34. }
  35.  
  36. function scrollButton(e)
  37. {
  38. if (e=eventIE(e)) current_speed=e.target.id==buttonDown.id ? -speed : speed
  39. if (clip_top-current_speed<0)
  40. {
  41. limitTop()
  42. return
  43. }
  44. if (clip_top+clip_size-current_speed>sc.offsetHeight) {
  45. limitDown()
  46. return
  47. }
  48. clip_top-=current_speed
  49. bar.style.top=(limit_top+Math.ceil(clip_top/(sc.offsetHeight-clip_size)*(limit_bottom-limit_top)))+'px'
  50. move()
  51. args=arguments // can't refer to 'arguments' directly in setTimeout()
  52. sc.timer=setTimeout('args.callee()', 1)
  53. }
  54.  
  55. function scrollBar(e)
  56. {
  57. if (!bar_offset)
  58. return
  59. e=eventIE(e)
  60. if (e.pageY-bar_offset<limit_top)
  61. {
  62. limitTop()
  63. return
  64. }
  65. if (e.pageY>limit_bottom+bar_offset)
  66. {
  67. clip_top=sc.offsetHeight-clip_size
  68. limitDown()
  69. return
  70. }
  71. bar.style.top=(e.pageY-bar_offset)+'px'
  72. move()
  73. }
  74.  
  75. function move()
  76. {
  77. position=(bar.offsetTop-limit_top)/(limit_bottom-limit_top)
  78. sc.style.top=(div_text_top-(Math.floor(sc.offsetHeight-clip_size)*position))+'px'
  79. clip_top=Math.floor((sc.offsetHeight-clip_size)*position)
  80. sc.style.clip='rect('+clip_top+'px '+sc.offsetWidth+'px '+(clip_top+clip_size)+'px 0px)'
  81. }
  82.  
  83. function limitTop()
  84. {
  85. clip_top=10
  86. bar.style.top=limit_top+'px'
  87. sc.style.top=div_text_top+'px'
  88. sc.style.clip='rect(0px '+sc.offsetWidth+'px '+clip_size+'px 0px)'
  89. }
  90.  
  91. function limitDown()
  92. {
  93. bar.style.top=limit_bottom+'px'
  94. sc.style.top=div_text_top+clip_size-sc.offsetHeight+'px'
  95. sc.style.clip='rect('+(sc.offsetHeight-clip_size)+'px '+sc.offsetWidth+'px '+sc.offsetHeight+'px 0px)'
  96. }
  97.  
  98. function take(e)
  99. {
  100. e=eventIE(e)
  101. bar_offset=e.pageY-bar.offsetTop
  102. }
  103.  
  104. function cast()
  105. {
  106. bar_offset=0
  107. }
  108.  
  109. function eventIE(e)
  110. {
  111. if (window.event && !window.opera)
  112. {
  113. e=window.event
  114. e.pageY=window.event.y
  115. e.target=window.event.srcElement
  116. }
  117. return e
  118. }
  119. }
  120. </script>[HTML]
  121.  
  122. [HTML]body,td,th {
  123. font-family: Arial;
  124. font-size: 10px;
  125. color: #191815;
  126. }
  127. body {
  128. margin-left: 0px;
  129. margin-top: 0px;
  130. margin-right: 0px;
  131. margin-bottom: 0px;
  132. background-color: #000000;
  133. background-image: url(images/rw_bg.jpg);
  134. }
  135. a {
  136. font-family: Arial;
  137. font-size: 10px;
  138. color: #D04608;
  139. }
  140. a:visited {
  141. color: #D04608;
  142. }
  143. a:hover {
  144. color: #D04608;
  145. }
  146. a:active {
  147. color: #D04608;
  148. }
  149. .B1A06A {
  150. color: #B1A06A;
  151. }
  152. #div_zero {
  153. position:absolute;
  154. left:0px;
  155. top:0px;
  156. width:1000px;
  157. height:704px;
  158. z-index:0;
  159. }
  160. #div_main_bg {
  161. position:absolute;
  162. left:126px;
  163. top:167px;
  164. width:709px;
  165. height:381px;
  166. z-index:2;
  167. background-image: url(images/rw_main_bg.jpg);
  168. background-repeat: no-repeat;
  169. }
  170. #menu {
  171. position:absolute;
  172. left:298px;
  173. top:55px;
  174. width:440px;
  175. height:32px;
  176. z-index:3;
  177. }
  178. (...)
  179. #div_text {
  180. position:absolute;
  181. left:10px;
  182. top:10px;
  183. width:681px;
  184. z-index:5;
  185. overflow:hidden;
  186. clip: rect(0px,681px,371px,0px);
  187. visibility: inherit;
  188. }
  189. #div_scroll {
  190. position:absolute;
  191. left:835px;
  192. top:167px;
  193. width:28px;
  194. height:381px;
  195. z-index:2;
  196. background-image: url(images/rw_scroll_line.png);
  197. }
  198. #scrollup {
  199. position: absolute;
  200. top: 0px;
  201. left: 0px;
  202. width: 28px;
  203. height: 28px;
  204. z-index: 3;
  205. background-image: url(images/rw_scroll_up.jpg);
  206. }
  207. #scrolldown {
  208. position: absolute;
  209. top: 351px;
  210. left: 0px;
  211. width: 28px;
  212. height: 30px;
  213. z-index: 3;
  214. background-image: url(images/rw_scroll_down.jpg);
  215. }
  216. #scrollbar {
  217. position: absolute;
  218. top: 28px;
  219. left: 0px;
  220. width: 28px;
  221. height: 38px;
  222. z-index: 3;
  223. background-image: url(images/rw_scroll_bar.jpg);
  224. background-repeat: no-repeat;
  225. background-position: center;
  226. }


  1. <body onload="scroller()">
  2. <div id="div_zero">
  3. <div id="div_main_bg">
  4. <div id="div_text">
  5. Lorem ipsum (...)Phasellus tincidunt tristique ligula. Mauris magna lorem, tincidunt eu, iaculis vitae, molestie in, risus. Donec ornare egestas pede. </div>
  6. </div>
  7. <div id="menu"><a href="#news"><img src="images/rw_news.jpg" alt="see: news" width="100" height="32" border="0"></a><a href="#about"><img src="images/rw_about.jpg" alt="see: about" width="98" height="32" border="0"></a><a href="#portfolio"><img src="images/rw_portfolio.jpg" alt="see: portfolio" width="128" height="32" border="0"></a><a href="#contact"><img src="images/rw_contact.jpg" alt="see: conctact" width="114" height="32" border="0"></a></div>
  8. <div id="div_scroll"><div id="scrollup"></div><div id="scrolldown"></div><div id="scrollbar"></div>
  9. </div>
  10. (...)
  11. </div>
  12. <map name="logo_adres2" id="logo_adres2">
  13. <area shape="rect" coords="65,0,139,45" href="#">
  14. </map>
  15. <map name="logo_adres1" id="logo_adres1">
  16. <area shape="rect" coords="65,33,139,75" href="#">
  17. </map>
  18. </body>