DHTML Forum  

Go Back   DHTML Forum > dhtmlcentral.com > DHTML Scripts
FAQ Members List Calendar Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Search this Thread Display Modes
  #1  
Old 30.05.2006, 01:08
gmn17 gmn17 is offline
Erfahrener Benutzer
 
Join Date: 18.01.2004
Location: USA
Posts: 207
Default

actually it's very much updated, the code is originally derived from this site, I need to see if it works in Safari, it works flawlessly in IE and FF.

<html>
<head>
<title>scroller1</title>
<style type="text/css" media="screen"><!--
/* <![CDATA[ */
.clContent{
position:relative;
left:0;top:0;
width:100%;height:auto;
border:0;margin:0;padding:0 1% 0 0;
font:normal 99% arial;color:#0080aa;
}
#scrollContainer1{
position:absolute;
left:50px;top:50px;
width:300px;height:200px;
border:3px solid #ffffff;margin:0;padding:0;
background:#ffffff;
overflow:hidden;
}
#scrollUp1{
position: absolute;
left:360px;top:50px;
width:10px;height:10px;
border:0;margin:0;padding:0;
background:#999999;
font-size:1px;
}
#scrollDown1{
position: absolute;
left:360px;top:240px;
width:10px;height:10px;
border:0;margin:0;padding:0;
background:#999999;
font-size:1px;
}
#scrollBar1{
position: absolute;
left:0;top:0;
width:10px;height:30px;
border:0;margin:0;padding:0;
background:#999999;
font-size:1px;
}
#scrollTrack1{
position:absolute;
left:360px;top:70px;
width:10px;height:160px;
border:0;margin:0;padding:0;
background:#eeeeee;
font-size:1px;
}
#scrollContainer2{
position:absolute;
left:450px;top:50px;
width:300px;height:300px;
border:3px solid #ffffff;margin:0;padding:0;
background:#ffffff;
overflow:hidden;
}
#scrollUp2{
position: absolute;
left:760px;top:50px;
width:10px;height:10px;
border:0;margin:0;padding:0;
background:#999999;
font-size:1px;
}
#scrollDown2{
position: absolute;
left:760px;top:210px;
width:10px;height:10px;
border:0;margin:0;padding:0;
background:#999999;
font-size:1px;
}
#scrollBar2{
position: absolute;
left:0;top:0;
width:10px;height:30px;
border:0;margin:0;padding:0;
background:#999999;
font-size:1px;
}
#scrollTrack2{
position: absolute;
left:760px;top:70px;
width:10px;height:130px;
border:0;margin:0;padding:0;
background:#eeeeee;
font-size:1px;
}
/* ]]> */
--></style>
<script language="javascript" type="text/javascript"><![CDATA[//><!--
/*
scroller1 script by rod morelos, haxored by gmn17AThotmailcom for filesize and browser detection/legacy code, inserted John Resig's add/remove event code and added two lines from Quirksmode to the fixEvent function, free to use if you keep the attribution
*/
function createObjectById(id){
this.el=document.getElementById?document.getElemen tById(id):null;
this.css=this.el.style;
this.i=createObjectById.registry.length;
createObjectById.registry[this.i]=this;
this.w=this.el.offsetWidth?this.el.offsetWidth:0;
this.h=this.el.offsetHeight?this.el.offsetHeight:0 ;
this.x=this.el.offsetLeft?this.el.offsetLeft:0;
this.y=this.el.offsetTop?this.el.offsetTop:0;
};
createObjectById.registry=[];
createObjectById.prototype.update=function(){
this.w=this.el.offsetWidth?this.el.offsetWidth:0;
this.h=this.el.offsetHeight?this.el.offsetHeight:0 ;
this.x=this.el.offsetLeft?this.el.offsetLeft:0;
this.y=this.el.offsetTop?this.el.offsetTop:0;
};
createObjectById.prototype.show=function(){
this.css.visibility='visible';
};
createObjectById.prototype.hide=function(){
this.css.visibility='hidden';
};
createObjectById.prototype.moveTo=function(x,y){
if (x!=null&&typeof x=='number'){
x=Math.round(x);
this.x=x;
this.css.left=x+'px';
}
if(y!=null&&typeof y=='number'){
y=Math.round(y);
this.y=y;
this.css.top=y+'px';
}};
createObjectById.prototype.setSize=function(w,h){
if(w!=null&&typeof w=='number'){
if(w<0) w=0;
w=Math.round(w);
this.css.width=w+'px';
}
if(h!=null&&typeof h=='number'){
if(h<0) h=0;
h=Math.round(h);
this.css.height=h+'px';
}
this.update();
};
function addEvent(obj,type,fn){ // add/remove by John Resig ejohn.org
if(obj.attachEvent){
obj['e'+type+fn]=fn;
obj[type+fn]=function(){
obj['e'+type+fn](window.event);
};
obj.attachEvent('on'+type,obj[type+fn]);
}
else obj.addEventListener(type,fn,false);
};
function removeEvent(obj,type,fn){
if(obj.detachEvent){
obj.detachEvent('on'+type,obj[type+fn]);
obj[type+fn]=null;
}
else obj.removeEventListener(type,fn,false);
};
function fixEvent(e,currentTarget){
if(!e) e=event;
if(!e.target) e.target=e.srcElement;
if(!e.currentTarget) e.currentTarget=currentTarget;
if(typeof e.layerX=='undefined') e.layerX=e.offsetX;
if(typeof e.layerY=='undefined') e.layerY=e.offsetY;
if(typeof e.clientX=='undefined') e.clientX=e.pageX;
if(typeof e.clientY=='undefined') e.clientY=e.pageY;
if(!e) e=window.event;e.cancelBubble=true; // from
if(e.stopPropagation) e.stopPropagation(); // Quirksmode
if(!e.stopPropagation) e.stopPropagation=function(){
this.cancelBubble=true;
};
if(!e.preventDefault) e.preventDefault=function(){
this.returnValue=false;
};
return e;
};
var scroller={
scrollables:2,
step:30,
speed:5,
wheelSpeed:15,
wheelScrolled:false,
timer:0,
contentY:0,
dragY:0,
clickY:0,
mouseDown:function(e){
e=fixEvent(e);
var mouseY=e.clientY;
var target=(e.target.nodeType==3||e.target.tagName.toL owerCase()=='img')?e.target.parentNode:e.target;sc roller.wheelScrolled=false;
for(var i=1;i<=scroller.scrollables;i++){
if(target.id==scroller.bar[i:ttzt077e8x].el.id){
scroller.bar[i:ttzt077e8x].grab=true;
scroller.clickY=mouseY-scroller.bar[i:ttzt077e8x].y;
e.preventDefault();
}else if(target.id==scroller.track[i:ttzt077e8x].el.id){
if(scroller.content[i:ttzt077e8x].h>scroller.container[i:ttzt077e8x].h){
scroller.track[i:ttzt077e8x].grab=true;
scroller.dragY=e.layerY-(scroller.bar[i:ttzt077e8x].h/2);
if(scroller.dragY<0) scroller.dragY=0;
if(scroller.dragY>scroller.track[i:ttzt077e8x].h-scroller.bar[i:ttzt077e8x].h) scroller.dragY=scroller.track[i:ttzt077e8x].h-scroller.bar[i:ttzt077e8x].h;
scroller.contentY=0-(scroller.dragY*(scroller.content[i:ttzt077e8x].h-scroller.container[i:ttzt077e8x].h)/Math.round(scroller.track[i:ttzt077e8x].h-scroller.bar[i:ttzt077e8x].h));
scroller.content[i:ttzt077e8x].moveTo(0,scroller.contentY);
scroller.bar[i:ttzt077e8x].moveTo(0,scroller.dragY);
e.preventDefault(e);
}}else if(target.id==scroller.up[i:ttzt077e8x].el.id){
scroller.up[i:ttzt077e8x].grab=true;
scroller.scroll(i,scroller.speed);
e.preventDefault();
}else if(target.id==scroller.down[i:ttzt077e8x].el.id){
scroller.down[i:ttzt077e8x].grab=true;
scroller.scroll(i,-scroller.speed);
e.preventDefault();
}}},
mouseUp:function(e){
for(var i=1;i<=scroller.scrollables;i++){
scroller.bar[i:ttzt077e8x].grab=false;
scroller.track[i:ttzt077e8x].grab=false;
scroller.up[i:ttzt077e8x].grab=false;
scroller.down[i:ttzt077e8x].grab=false;
}
clearTimeout(scroller.timer);
},
mouseMove:function(e){
for(var i=1;i<=scroller.scrollables;i++){
if(scroller.bar[i:ttzt077e8x].grab&&scroller.content[i:ttzt077e8x].h>scroller.container[i:ttzt077e8x].h){
e=fixEvent(e);
var mouseY=e.clientY;
scroller.dragY=mouseY-scroller.clickY;
if(scroller.dragY<0) scroller.dragY=0;
if(scroller.dragY>scroller.track[i:ttzt077e8x].h-scroller.bar[i:ttzt077e8x].h) scroller.dragY=scroller.track[i:ttzt077e8x].h-scroller.bar[i:ttzt077e8x].h;
scroller.contentY=0-(scroller.dragY*(scroller.content[i:ttzt077e8x].h-scroller.container[i:ttzt077e8x].h)/Math.round(scroller.track[i:ttzt077e8x].h-scroller.bar[i:ttzt077e8x].h));
scroller.content[i:ttzt077e8x].moveTo(0,scroller.contentY);
scroller.bar[i:ttzt077e8x].moveTo(0,scroller.dragY);
e.preventDefault();
}}},
scroll:function(num,speed){
if(scroller.content[num].y<0||scroller.content[num].y>-scroller.content[num].h+scroller.container[num].h){
scroller.contentY=scroller.content[num].y+speed;
if(scroller.contentY<-(scroller.content[num].h-scroller.container[num].h)) scroller.contentY=-scroller.content[num].h+scroller.container[num].h;
else if(scroller.contentY>0) scroller.contentY=0;
scroller.content[num].moveTo(0,scroller.contentY);
scroller.dragY=0-(scroller.content[num].y* Math.round(scroller.track[num].h-scroller.bar[num].h)/(scroller.content[num].h-scroller.container[num].h));
scroller.bar[num].moveTo(0,scroller.dragY);
if(!scroller.wheelScrolled) scroller.timer=setTimeout('scroller.scroll('+num+' ,'+speed+')',scroller.step);
}},
wheelScroll:function(e){
e=fixEvent(e);
var el=e.target;
if(el.id.slice(0,el.id.length-1)!='scrollContent'){
do el=el.parentNode;
while(el.tagName.toLowerCase()!='div'||el.id.slice (0,el.id.length-1)!='scrollContent');
}
var i=el.id.charAt(el.id.length-1);
if(window.event.wheelDelta<=-120){
scroller.wheelScrolled=true;
scroller.scroll(i,-scroller.wheelSpeed);
}else if(window.event.wheelDelta>=120){
scroller.wheelScrolled=true;
scroller.scroll(i,scroller.wheelSpeed);
}
e.preventDefault();
},
init:function(){
scroller.container=new Array();
scroller.content=new Array();
scroller.bar=new Array();
scroller.up=new Array();
scroller.down=new Array();
scroller.track=new Array();
for(var i=1;i<=scroller.scrollables;i++){
scroller.container[i:ttzt077e8x]=new createObjectById('scrollContainer'+i);
scroller.content[i:ttzt077e8x]=new createObjectById('scrollContent'+i);
scroller.bar[i:ttzt077e8x]=new createObjectById('scrollBar'+i);
scroller.bar[i:ttzt077e8x].grab=false;
scroller.track[i:ttzt077e8x]=new createObjectById('scrollTrack'+i);
scroller.track[i:ttzt077e8x].grab=false;
scroller.up[i:ttzt077e8x]=new createObjectById('scrollUp'+i);
scroller.up[i:ttzt077e8x].grab=false;
scroller.down[i:ttzt077e8x]=new createObjectById('scrollDown'+i);
scroller.down[i:ttzt077e8x].grab=false;
}
addEvent(document,'mousemove',scroller.mouseMove,f alse);
addEvent(document,'mousedown',scroller.mouseDown,f alse);
addEvent(document,'mouseup',scroller.mouseUp,false );
addEvent(document,'mousewheel',scroller.wheelScrol l,false);
}}
// onload = scroller.init; // use body onload or function onload instead
//--><!]]></script>
</head>
<body onload="scroller.init();">
<div id="scrollContainer1">
<div id="scrollContent1" class="clContent">
Do animals have nervous breakdowns?



No, but they can suffer mental illness when in inappropriate conditions or mistreated. Wild animals in captivity can be driven crazy by boredom or the torment of being on permanent public display. Such mental anguish can manifest itself in self-mutilation, rhythmic pacing or repetitive vocalisations - all similar to compulsive human behaviour. Animals aren't known to commit suicide, though, as the don't have the same philosophical concept of "self" as man.



Do earthworms drown in waterlogged soils?



Sadly, yes. Worms can survive in well-aerated water for up to a year and are even found in special burrows at the bottom of lakes. But waterlogging usually means that the oxygen content of the water is particularly low so any earthworms present will be asphyxiated. If they escape to the soil surface, their immediate respiratory problems are solved. Ironically, though, earthworms tend to perish when exposed to sunlight for too long as their highly permeable body surfaces - which they use to absorb oxygen and release carbon dioxied - lose a lot of moisture on dry days.



Q: Is there a maximum size that raindrops can be?



Yes. Any raindrop larger than seven millimetres in diameter will split ino pieces as it falls. Raindrops are made of minute water particles that bonds together in cluds. The larger raindrops become, the less effective their surface tension is at holding them together. This makes them increasingly unstable, and as they pick up speed on their way to earth, turbulence and other aerodynamic forces will rip them apart. This will normally happen to a seven-millimeter-wide droplet when it hits a speed of around 30 kilometers per hour.



How does quicksand work?



Quicksand is a pocket of ordinary sand that has water continuously flowing up through it from an underground source, such as a spring. The flow lifts the grains of sand apart, but is not strong enough to disperse them completely and the resultant thick mixture can look like a solid mass - until you step into it and slowly start sinking.



</div>
</div>

<div id="scrollUp1">[img]scrollarrow_up.gif[/img]</div>
<div id="scrollTrack1"><div id="scrollBar1">[img]slider.gif[/img]</div></div>
<div id="scrollDown1">[img]scrollarrow_down.gif[/img]</div>

<div id="scrollContainer2">
<div id="scrollContent2" class="clContent">
Why do we drink a "toast" to people?



In the 1600s, people flavored their drinks with spiced toast. If you toasted to someone, you were saying you held them in such high esteem that the very sound of their name flavored a drink as the spiced toast might.



Which came first, the chicken or the egg?



The egg. The modern chicken is generally believed to be a "descendant" of Archaeopteryx, the oldest known bird. This 150-million-year-old resident of the Jurassic period laid eggs, and at some point evolved into an animal that was one generation away from being a proper chicken. This creature would have produced the egg out of which the first chicken emerged. Therefore, the egg came first.



How were rope bridges built across wide ravines in remote places?



A few members of an expedition would somehow have to find a way down the ravine and up the other side - even if it took a couple of days and meant crossing rivers.



Once there, the main group could shoot an arrow attached to thin twine across to them. The main group's end of the twine was tied to thicker ropes which the other group could drag over to their side, secure and use as a basis for the bridge.



These days, hooks attached to steel wire can be fired into rock crevices or the ground on the far side of a ravine, enabling people to swing to the other side and start their bridge.



</div>
</div>

<div id="scrollUp2">[img]scrollarrow_up.gif[/img]</div>
<div id="scrollTrack2"><div id="scrollBar2">[img]slider.gif[/img]</div></div>
<div id="scrollDown2">[img]scrollarrow_down.gif[/img]</div>

</body>

</html>

gmail? g-mail? I have gmail it used to be email? e-mail?
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump

All times are GMT +2. The time now is 03:40.


Powered by vBulletin® Version 3.6.7
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.