Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JS] Problem ze skrptem pokazu slajdów
Forum PHP.pl > Forum > Przedszkole
Exenatus
Znalazłem taki skrypt i potrzebuje go trochę zmienic. Jak zrobić aby zatrzymywał się pokaz po najechaniu myszką w każdym momencie a nie tylko na końcu "drogi" i jak zwolnić przewijanie sie obrazka? Za pomoc dzięki


  1. <?php
  2. /***********************************************
  3. * Pausing up-down scroller- Š Dynamic Drive (www.dynamicdrive.com)
  4. * This notice MUST stay intact for legal use
  5. * Visit <a href=\"http://www.dynamicdrive.com/\" target=\"_blank\">http://www.dynamicdrive.com/</a> for this script and 100s more.
  6. ***********************************************/
  7.  
  8. function pausescroller(content, divId, divClass, delay){
  9. this.content=content //message array content
  10. this.tickerid=divId //ID of ticker div to display information
  11. this.delay=delay //Delay between msg change, in miliseconds.
  12. this.mouseoverBol=0 //Boolean to indicate whether mouse is currently over scroller (and pause it if it is)
  13. this.hiddendivpointer=1 //index of message array for hidden div
  14. document.write('<div id="'+divId+'" class="'+divClass+'" style="position: relative; overflow: hidden"><div class="innerDiv" style="position: absolute; width: 100%" id="'+divId+'1">'+content[0]+'</div><div class="innerDiv" style="position: absolute; width: 100%; visibility: hidden" id="'+divId+'2">'+content[1]+'</div></div>')
  15. var scrollerinstance=this
  16. if (window.addEventListener) //run onload in DOM2 browsers
  17. window.addEventListener("load", function(){scrollerinstance.initialize()}, false)
  18. else if (window.attachEvent) //run onload in IE5.5+
  19. window.attachEvent("onload", function(){scrollerinstance.initialize()})
  20. else if (document.getElementById) //if legacy DOM browsers, just start scroller after 0.5 sec
  21. setTimeout(function(){scrollerinstance.initialize()}, 500)
  22. }
  23.  
  24. // -------------------------------------------------------------------
  25. // initialize()- Initialize scroller method.
  26. // -Get div objects, set initial positions, start up down animation
  27. // -------------------------------------------------------------------
  28.  
  29. pausescroller.prototype.initialize=function(){
  30. this.tickerdiv=document.getElementById(this.tickerid)
  31. this.visiblediv=document.getElementById(this.tickerid+"1")
  32. this.hiddendiv=document.getElementById(this.tickerid+"2")
  33. this.visibledivtop=parseInt(pausescroller.getCSSpadding(this.tickerdiv))
  34. //set width of inner DIVs to outer DIV's width minus padding (padding assumed to be top padding x 2)
  35. this.visiblediv.style.width=this.hiddendiv.style.width=this.tickerdiv.offsetWidth-(this.visibledivtop*2)+"px"
  36. this.getinline(this.visiblediv, this.hiddendiv)
  37. this.hiddendiv.style.visibility="visible"
  38. var scrollerinstance=this
  39. document.getElementById(this.tickerid).onmouseover=function(){scrollerinstance.mouseoverBol=1}
  40. document.getElementById(this.tickerid).onmouseout=function(){scrollerinstance.mouseoverBol=0}
  41. if (window.attachEvent) //Clean up loose references in IE
  42. window.attachEvent("onunload", function(){scrollerinstance.tickerdiv.onmouseover=scrollerinstance.tickerdiv.onmouseout=null})
  43. setTimeout(function(){scrollerinstance.animateup()}, this.delay)
  44. }
  45.  
  46.  
  47. // -------------------------------------------------------------------
  48. // animateup()- Move the two inner divs of the scroller up and in sync
  49. // -------------------------------------------------------------------
  50.  
  51. pausescroller.prototype.animateup=function(){
  52. var scrollerinstance=this
  53. if (parseInt(this.hiddendiv.style.top)>(this.visibledivtop+5)){
  54. this.visiblediv.style.top=parseInt(this.visiblediv.style.top)-5+"px"
  55. this.hiddendiv.style.top=parseInt(this.hiddendiv.style.top)-5+"px"
  56. setTimeout(function(){scrollerinstance.animateup()}, 50)
  57. }
  58. else{
  59. this.getinline(this.hiddendiv, this.visiblediv)
  60. this.swapdivs()
  61. setTimeout(function(){scrollerinstance.setmessage()}, this.delay)
  62. }
  63. }
  64.  
  65. // -------------------------------------------------------------------
  66. // swapdivs()- Swap between which is the visible and which is the hidden div
  67. // -------------------------------------------------------------------
  68.  
  69. pausescroller.prototype.swapdivs=function(){
  70. var tempcontainer=this.visiblediv
  71. this.visiblediv=this.hiddendiv
  72. this.hiddendiv=tempcontainer
  73. }
  74.  
  75. pausescroller.prototype.getinline=function(div1, div2){
  76. div1.style.top=this.visibledivtop+"px"
  77. div2.style.top=Math.max(div1.parentNode.offsetHeight, div1.offsetHeight)+"px"
  78. }
  79.  
  80. // -------------------------------------------------------------------
  81. // setmessage()- Populate the hidden div with the next message before it's visible
  82. // -------------------------------------------------------------------
  83.  
  84. pausescroller.prototype.setmessage=function(){
  85. var scrollerinstance=this
  86. if (this.mouseoverBol==1) //if mouse is currently over scoller, do nothing (pause it)
  87. setTimeout(function(){scrollerinstance.setmessage()}, 100)
  88. else{
  89. var i=this.hiddendivpointer
  90. var ceiling=this.content.length
  91. this.hiddendivpointer=(i+1>ceiling-1)? 0 : i+1
  92. this.hiddendiv.innerHTML=this.content[this.hiddendivpointer]
  93. this.animateup()
  94. }
  95. }
  96.  
  97. pausescroller.getCSSpadding=function(tickerobj){ //get CSS padding value, if any
  98. if (tickerobj.currentStyle)
  99. return tickerobj.currentStyle["paddingTop"]
  100. else if (window.getComputedStyle) //if DOM2
  101. return window.getComputedStyle(tickerobj, "").getPropertyValue("padding-top")
  102. else
  103. return 0
  104. }
  105. ?>
Exenatus
Oczywiscie to JS a nie PHP źle zazaczyłem...

// Proszę nie pisać pod swoimi postami.
// ~webdicepl
erix
z palca, po tym:
Kod
pausescroller.prototype.animateup=function(){
var scrollerinstance=this;


wstaw:
Kod
if(this.mouseoverBol){return;}


Cytat
i jak zwolnić przewijanie sie obrazka?

Pobaw się wartościami w setTimeout.
Exenatus
Dzięki wielkie ale jeszcze nie tak. Bo jak najeżdża się to się zatrzymuje i już stoi. A ja chciałbym żeby pokaz zatrzymywał się po najechaniu oraz ruszał po zabraniu najechania.tongue.gif jak to zrobic ?
erix
Kod
if(this.mouseoverBol){
    setTimeout(function(){scrollerinstance.animateup()}, 50);
    return;
}
-Exenatus-
Dzięki . Pomogłeś mi bardzo smile.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.