PDA

View Full Version : Is this hava script based or some thing else??



raja
08-03-2009, 06:51 AM
Is this Java script based or some thing else?? The pull me effect there at the top.
Click Here (http://www.mutinydesign.co.uk/portfolio/airport-shuttle-services/)

Snookerman
08-03-2009, 07:32 AM
It's MooTools (http://mootools.net/), a JavaScript library. I'm not sure about the plugin though, you'll have to search for that.

Good luck!

vwphillips
08-03-2009, 09:01 AM
It is quite easy to set up using custom scroll bars

one of many scripts

http://www.vicsjavascripts.org.uk/CustomScrollBarsIII/CustomScrollBarsIII.htm

raja
08-03-2009, 01:41 PM
@ is it a word press plug in???
@VW Phillips its really awesome.You are a Guru at "Java script"

vwphillips
08-03-2009, 03:27 PM
@ is it a word press plug in???

No



@VW Phillips its really awesome.You are a Guru at "Java script"


Hardly but I can set this up with your images if you want me to.

raja
08-03-2009, 03:55 PM
yes i pmed u plz see

vwphillips
08-03-2009, 04:53 PM
from PM

Hi Respected sir, am raja from India, seems ur a Guru at Java script. can u help me on one image slide show on my site please? My Basic concept is Like this . please see the attached image. I want a image slide show with 2 controls. Like this:



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title></title>
<style type="text/css">
/*<![CDATA[*/
#tst {
position:relative;width:50%;height:60px;border:solid black 1px;
}

.slide {
position:relative;overflow:hidden;top:5px;width:80%;height:50px;border:solid black 1px;
}

.slider {
position:absolute;top:0px;width:1300px;height:50px;
}
.slider IMG{
position:absolute;left:0px;top:0px;width:50px;height:50px;
}
/*]]>*/
</style>
<script src="http://www.vicsjavascripts.org.uk/AnimatorBasic/AnimatorBasic.js" type="text/javascript">
// see http://www.vicsjavascripts.org.uk/AnimatorBasic/AnimatorBasic.js
</script>

<script type="text/javascript">
/*<![CDATA[*/

function Slide(id,nu,ms){
this.obj=document.getElementById(id);
this.slides=this.obj.getElementsByTagName('DIV');
this.imgs=this.slides[1].getElementsByTagName('IMG');
this.w=this.imgs[0].width;
this.lgth=this.imgs.length;
this.ms=ms||1000;
this.nu=nu;
this.cnt=0;
this.ReSize();
}

Slide.prototype.ReSize=function(){
this.slides[0].style.left=(this.obj.offsetWidth-this.slides[0].offsetWidth)/2+'px';
var lft=(this.slides[0].offsetWidth-this.w*this.nu)/(this.nu);
for (var z0=0;z0<this.lgth;z0++){
this.imgs[z0].style.left=(this.w+lft)*z0+lft/2+'px';
}
this.os=lft/2;
this.Next(0,10);
}

Slide.prototype.Next=function(ud,ms){
this.cnt+=this.nu*ud;
this.cnt=Math.max(Math.min(this.cnt,this.lgth),0);
if (this.cnt==this.lgth&&ud<0) this.lgth-this.nu;
zxcBAnimator('left',this.slides[1],this.slides[1].offsetLeft,-this.imgs[Math.min(this.cnt,this.lgth-this.nu)].offsetLeft+this.os,ms||this.ms,[0,this.imgs[this.lgth-1].offsetLeft]);
}

/*]]>*/
</script>


</head>

<body onload="S=new Slide('tst',4,1000);" onresize="S.ReSize();" >
<input type="button" name="" value="Fwd" onclick="S.Next(1);"/>
<input type="button" name="" value="Back" onclick="S.Next(-1);"/>
<div id="tst" >
<div class="slide" >
<div class="slider" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Zero.gif" />
<img src="http://www.vicsjavascripts.org.uk/StdImages/One.gif" />
<img src="http://www.vicsjavascripts.org.uk/StdImages/Two.gif" />
<img src="http://www.vicsjavascripts.org.uk/StdImages/Three.gif" />
<img src="http://www.vicsjavascripts.org.uk/StdImages/Four.gif" />
<img src="http://www.vicsjavascripts.org.uk/StdImages/Five.gif" />
<img src="http://www.vicsjavascripts.org.uk/StdImages/Six.gif" />
<img src="http://www.vicsjavascripts.org.uk/StdImages/Seven.gif" />
<img src="http://www.vicsjavascripts.org.uk/StdImages/Eight.gif" />
<img src="http://www.vicsjavascripts.org.uk/StdImages/Nine.gif" />
</div>
</div>
</div>
</body>
</html>

you will not need onresize="S.ReSize(); unless your sizes are in percentage(%)