PDA

View Full Version : Simple Controls Gallery v1.4 - pause on mouseover



backyarder1
08-27-2011, 02:11 AM
1) Script Title: Simple Controls Gallery v1.4


2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/simplegallery.htm

3) Describe problem: The script is great, as is every single script I've ever gotten from this site. But I would like to make it so that it pauses over the current slide on mouseover.

Here is my site. Thanks so much!
http://www.tomfranz.com/about.shtml

Betsy S. Franz :o

jscheuer1
08-27-2011, 05:51 AM
<script type="text/javascript">

var mygallery=new simpleGallery({
wrapperid: "simplegallery1", //ID of main gallery container,
dimensions: [400, 300], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
imagearray: [
["hfotsl.jpg", "http://en.wikipedia.org/wiki/Swimming_pool", "_new", "Tom initiated Holiday Builder's involvement with Homes for Our Troops, building a specially adapted home for an injured Veteran in Brevard County in 2008."],
["greensl.jpg", "", "", "Instrumental in leading Holiday Builders into the Energy Efficient and Green Building technologies, resulting in the first Energy Star qualified, FGBC certified green home in the HBCA of Brevard's Parade of Homes."],
["jdpowersl.jpg", "", "", "Tom was regional manager when Holiday Builders Received a JD Powers award in 2009."],
["extreme1sl.jpg", "", "", "Tom participated in the Extreme Makeover Home Edition: Space Coast build as a Project Lead."],
["extremesl.jpg", "", "", "Tom and Betsy at kickoff ceremony for Extreme Makeover Home Edition: Space Coast"]
],

autoplay: [true, 5000, 2], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
oninit:function(){ //event that fires when gallery has initialized/ ready to run
//Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
var show = this;
this.setting.$wrapperdiv.hover(function(){
show.navigate("play/pause");
}, function(){
show.navigate("play/pause");
});
},
onslide:function(curslide, i){ //event that fires after each slide is shown
//Keyword "this": references current gallery instance
//curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
//i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
this.showhidedescpanel("show")

}
})

</script>

But you might want to increase the number of rotations (recommended):


autoplay: [true, 5000, 10000], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]

And, you might want the image to change immediately on mouse out (optional, a matter of taste):


oninit:function(){ //event that fires when gallery has initialized/ ready to run
//Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
var show = this;
this.setting.$wrapperdiv.hover(function(){
show.navigate("play/pause");
}, function(){
show.navigate('next');
show.navigate("play/pause");
});
},

backyarder1
08-27-2011, 02:34 PM
Thanks so much John. It appears to be exactly what I needed.

Hope you are safely away from Irene and can have a wonderful weekend.

Betsy