Ankündigung

Einklappen
Keine Ankündigung bisher.

[Code] Scroll Onmouseover

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [Code] Scroll Onmouseover

    Falls ihr zu faul seid den scrollbalken oder das rad an der maus zu nutzen, hier ein kleines Script was euch beim überfahren eines Feldes das scrollen erlaubt

    Code:
    <style type="text/css">   
    #divUpControl{position:absolute; width:320; left:10; top:10; z-index:1; text-align: right}  
    #divDownControl{position:absolute; width:320; left:10; top:270; z-index:1; text-align: right}  
    #divContainer{position:absolute; width:320; height:240; overflow:hidden; top:30; left:10; clip:rect(0,320,240,0); visibility:hidden}  
    #divContent{position:absolute; top:0; left:0}  
    </style> 
    <script language="JavaScript">// begin absolutely positioned scrollable area object scripts  
    /* 
    Extension developed by David G. Miles (www.z3roadster.net/dreamweaver) 
    Original Scrollable Area code developed by Thomas Brattli  
    To add more shock to your site, visit www.DHTML Shock.com 
    */ 
     
    function verifyCompatibleBrowser(){  
        this.ver=navigator.appVersion  
        this.dom=document.getElementById?1:0  
        this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;  
        this.ie4=(document.all && !this.dom)?1:0;  
        this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;  
      
        this.ns4=(document.layers && !this.dom)?1:0;  
        this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)  
        return this  
    }  
    bw=new verifyCompatibleBrowser()  
      
      
    var speed=50  
      
    var loop, timer  
      
    function ConstructObject(obj,nest){  
        nest=(!nest) ? '':'document.'+nest+'.'  
        this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0;  
        this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0;  
        this.scrollHeight=bw.ns4?this.css.document.height:this.el.offsetHeight  
        this.clipHeight=bw.ns4?this.css.clip.height:this.el.offsetHeight  
        this.up=MoveAreaUp;this.down=MoveAreaDown;  
        this.MoveArea=MoveArea; this.x; this.y;  
        this.obj = obj + "Object"  
        eval(this.obj + "=this")  
        return this  
    }  
    function MoveArea(x,y){  
        this.x=x;this.y=y  
        this.css.left=this.x  
        this.css.top=this.y  
    }  
      
    function MoveAreaDown(move){  
        if(this.y>-this.scrollHeight+objContainer.clipHeight){  
        this.MoveArea(0,this.y-move)  
        if(loop) setTimeout(this.obj+".down("+move+")",speed)  
        }  
    }  
    function MoveAreaUp(move){  
        if(this.y<0){  
        this.MoveArea(0,this.y-move)  
        if(loop) setTimeout(this.obj+".up("+move+")",speed)  
        }  
    }  
      
    function PerformScroll(speed){  
        if(initialised){  
            loop=true;  
            if(speed>0) objScroller.down(speed)  
            else objScroller.up(speed)  
        }  
    }  
      
    function CeaseScroll(){  
        loop=false  
        if(timer) clearTimeout(timer)  
    }  
    var initialised;  
    function InitialiseScrollableArea(){  
        objContainer=new ConstructObject('divContainer')  
        objScroller=new ConstructObject('divContent','divContainer')  
        objScroller.MoveArea(0,0)  
        objContainer.css.visibility='visible'  
        initialised=true;  
    }  
    // end absolutely positioned scrollable area object scripts  
     
    </script> 
     
    <body bgcolor="999999" onLoad="InitialiseScrollableArea()"> 
     
    <!-- begin absolutely positioned scrollable area object-->  
    <div id="divUpControl"> <a href="javascript:;" onMouseOver="PerformScroll(-7)" onMouseOut="CeaseScroll()">[scroll  
      up]</a> </div> 
    <div id="divDownControl"> <a href="javascript:;" onMouseOver="PerformScroll(7)" onMouseOut="CeaseScroll()">[scroll  
      down]</a> </div> 
    <div id="divContainer">  
      <div id="divContent"> <b>Scroll Area Content Start</b>  
        <p> Lorem ipsum dolor sit amet, consectetur adipscing elit, sed diam nonnumy  
          eiusmod tempor incidunt ut labore et dolore magna aliquam erat volupat.</p> 
        <p>Et harumd dereud facilis est er expedit distinct. Nam liber a tempor cum  
          soluta nobis eligend optio comque nihil quod a impedit anim id quod maxim  
          placeat facer possim omnis es voluptas assumenda est, omnis dolor repellend.  
          Temporem autem quinsud et aur office debit aut tum rerum necesit atib saepe  
          eveniet ut er repudiand sint et molestia non este recusand.</p> 
        <p>Lorem ipsum dolor sit amet, consectetur adipscing elit, sed diam nonnumy  
          eiusmod tempor incidunt ut labore et dolore magna aliquam erat volupat.</p> 
        <p>Et harumd dereud facilis est er expedit distinct. Nam liber a tempor cum  
          soluta nobis eligend optio comque nihil quod a impedit anim id quod maxim  
          placeat facer possim omnis es voluptas assumenda est, omnis dolor repellend.  
          Temporem autem quinsud et aur office debit aut tum rerum necesit atib saepe  
          eveniet ut er repudiand sint et molestia non este recusand.</p> 
        <b>Scroll Area Content End</b> </div> 
    </div> 
    <!-- end absolutely positioned scrollable area object -->
    MfG
    Ithron


  • #2
    Scroll Mouseover vertical bearbeitet

    <style type="text/css">
    #divUpControl{ float:left; width:320; z-index:1; }
    #divDownControl{ width:320; z-index:1; }
    #divContainer{ float:left; height:110; width:400; overflow:hidden; clip:rect(0,320,240,0); visibility:hidden}
    #divContent{position:absolute; }
    </style>
    <script language="JavaScript">// begin absolutely positioned scrollable area object scripts
    /*
    Extension developed by David G. Miles (z3 roadster bmw floor mat at z3roadster.net)
    Original Scrollable Area code developed by Thomas Brattli
    To add more shock to your site, visit www.DHTML Shock.com
    */

    function verifyCompatibleBrowser(){
    this.ver=navigator.appVersion
    this.dom=document.getElementById?1:0
    this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
    this.ie4=(document.all && !this.dom)?1:0;
    this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;

    this.ns4=(document.layers && !this.dom)?1:0;
    this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
    return this
    }
    bw=new verifyCompatibleBrowser()


    var speed=50

    var loop, timer

    function ConstructObject(obj,nest){
    nest=(!nest) ? '':'document.'+nest+'.'
    this.el=bw.dom?document.getElementById(obj):bw.ie4 ?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0;
    this.css=bw.dom?document.getElementById(obj).style :bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0;
    this.scrollHeight=bw.ns4?this.css.document.height: this.el.offsetHeight
    this.clipHeight=bw.ns4?this.css.clip.height:this.e l.offsetHeight
    this.up=MoveAreaUp;this.down=MoveAreaDown;
    this.MoveArea=MoveArea; this.x; this.y;
    this.obj = obj + "Object"
    eval(this.obj + "=this")
    return this
    }
    function MoveArea(x,y){
    this.x=x;this.y=y
    this.css.left=this.x
    this.css.top=this.y
    }

    function MoveAreaDown(move){
    if(this.x>-this.scrollHeight+objContainer.clipHeight){
    this.MoveArea(this.x-move,0)
    if(loop) setTimeout(this.obj+".down("+move+")",speed)
    }
    }
    function MoveAreaUp(move){
    if(this.x<0){
    this.MoveArea(this.x-move,0)
    if(loop) setTimeout(this.obj+".up("+move+")",speed)
    }
    }

    function PerformScroll(speed){
    if(initialised){
    loop=true;
    if(speed>0) objScroller.down(speed)
    else objScroller.up(speed)
    }
    }

    function CeaseScroll(){
    loop=false
    if(timer) clearTimeout(timer)
    }
    var initialised;
    function InitialiseScrollableArea(){
    objContainer=new ConstructObject('divContainer')
    objScroller=new ConstructObject('divContent','divContainer')
    objScroller.MoveArea(0,0)
    objContainer.css.visibility='visible'
    initialised=true;
    }
    // end absolutely positioned scrollable area object scripts

    </script>

    <body bgcolor="999999" onLoad="InitialiseScrollableArea()">

    <!-- begin absolutely positioned scrollable area object-->
    <div id="divUpControl"> <a href="javascript:;" onMouseOver="PerformScroll(-7)" onMouseOut="CeaseScroll()">[scroll
    left]</a> </div>
    <div id="divDownControl"> <a href="javascript:;" onMouseOver="PerformScroll(7)" onMouseOut="CeaseScroll()">[scroll
    right]</a> </div>
    <div id="divContainer">
    <div id="divContent">
    <b>Scroll Area Content Start</b>
    <p> Lorem ipsum dolor sit amet, consectetur adipscing elit, sed diam nonnumy
    eiusmod tempor incidunt ut labore et dolore magna aliquam erat volupat.</p>
    <p>Et harumd dereud facilis est er expedit distinct. Nam liber a tempor cum
    soluta nobis eligend optio comque nihil quod a impedit anim id quod maxim
    placeat facer possim omnis es voluptas assumenda est, omnis dolor repellend.
    Temporem autem quinsud et aur office debit aut tum rerum necesit atib saepe
    eveniet ut er repudiand sint et molestia non este recusand.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipscing elit, sed diam nonnumy
    eiusmod tempor incidunt ut labore et dolore magna aliquam erat volupat.</p>
    <p>Et harumd dereud facilis est er expedit distinct. Nam liber a tempor cum
    soluta nobis eligend optio comque nihil quod a impedit anim id quod maxim
    placeat facer possim omnis es voluptas assumenda est, omnis dolor repellend.
    Temporem autem quinsud et aur office debit aut tum rerum necesit atib saepe
    eveniet ut er repudiand sint et molestia non este recusand.</p>
    <b>Scroll Area Content End</b>
    </div>
    </div>
    <!-- end absolutely positioned scrollable area object -->

    Kommentar


    • #3
      @ -x: Da passiert bei mir goar nix. Nicht mal der Content wird angezeigt. Das andere ist ganz neckisch. Noch schöner wäre, wenn man die Scrolleiste anzeigen könnte.
      --

      „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
      Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“


      --

      Kommentar

      Lädt...
      X