﻿// CREDITS:
// Free JavaScript Image Scroller with double-fade effect
// By Peter Gehrig
// Copyright (c) 2011 Peter Gehrig. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// Additional scripts can be found at http://www.fabulant.com

// IMPORTANT:
// If you add this script to a script-library or script-archive
// you have to add a highly visible link to
// http://www.fabulant.com on the webpage
// where this script will be featured

/////////////////////////////////////////////
// START OF SCRIPT CONFIGURATION 
/////////////////////////////////////////////

// Set the URLs of images, the comment and links.
// Add as many pictures a you like
// Each image requires a block, as shown below:
// {
// imgurl : "http://www.the-url.com/of/your/picture.jpg",
// comment : "the comment below the image",
// linkto : "http://www.where-you-go-if-you-click-on-a-image.com",
// }, each block ends with a comma (exception: the very last block)

var picture= [
{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/mandir_500w.png",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__016.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__012.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__019.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__022.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__029.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__032.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__040.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__047.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__007.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__026.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__001.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__002.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__003.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__005.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__006.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__008.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__009.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__010.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__014.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__011.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__013.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__015.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__017.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__018.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__030.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__031.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__020.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__024.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__025.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__027.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__028.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__035.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__036.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__037.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__038.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__039.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__033.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__034.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__041.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__045.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__046.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}, // comma required

{
imgurl : "http://www.shreemandir.org/SMImages/Dieties/Header/ShreeMandir__044.jpg",
comment : "",
linkto : "http://www.shreemandir.org"
}

]

// width of the visibie part of the slideshow (pixels)
var scrollerwidth=500

// height of the slideshow (pixels).
// ATTENTION: The height must include height of image plus height of text!
var scrollerheight=155

// width of the transparent zones on the left and on the right (pixels)
var transparentzone_width=0

// the color for the transpranet zone on the left and on the right
var transparentzone_color="#FF6600"

/////////////////////////////////////////////
// END OF SCRIPT CONFIGURATION 
/////////////////////////////////////////////

// do not edit below this line
var translayerswidth=1
var translayersmax=Math.floor(transparentzone_width/translayerswidth)
var translayersleftpos=0
var translayersopacity=100
var translayersfactor=100/translayersmax
var translayerswidthall=translayersmax*translayerswidth
var allpicturewidth
var distancepictopic=0
var scrollerleft=0
var scrollertop=0
var pause=20
var step=2
var newstep=step
var clipleft,clipright,cliptop,clipbottom
var i_picture=0
var timer
var picturecontent=""
var ns4=document.layers?1:0
var ns6=document.getElementById&&!document.all?1:0 
var ie=document.all?1:0
var browserinfos=navigator.userAgent 
var opera=browserinfos.match(/Opera/)  

var preloadedimages=new Array()
for (i=0;i<picture.length;i++){
	preloadedimages[i]=new Image()
	preloadedimages[i].src=picture[i].imgurl
}

function init() {
	allpicturewidth=document.getElementById('emptypicturediv').offsetWidth
	document.getElementById('picturediv').style.top=scrollertop+"px"
    document.getElementById('picturediv').style.left=scrollerleft+scrollerwidth+"px"
	clipleft=0
	clipright=0
	cliptop=0
	clipbottom=scrollerheight
	document.getElementById('picturediv').style.clip ="rect("+cliptop+"px "+clipright+"px "+clipbottom+"px "+clipleft+"px)"
	document.getElementById('picturediv').style.visibility="visible"
	scrollpicture()  
}

function scrollpicture() {
	if (parseInt(document.getElementById('picturediv').style.left)>=scrollerleft-allpicturewidth) {
		document.getElementById('picturediv').style.left=parseInt(document.getElementById('picturediv').style.left)-step+"px"
		clipright+=step
		if (clipright>scrollerwidth) {
			clipleft+=step
		}
		document.getElementById('picturediv').style.clip ="rect("+cliptop+"px "+clipright+"px "+clipbottom+"px "+clipleft+"px)"		
		var timer=setTimeout("scrollpicture()",pause)
	}
	else {
		resetposition()
	}
}

function onmsover() {
	step=0
}
function onmsout() {
	step=newstep
}

function resetposition() {
	allpicturewidth=document.getElementById('emptypicturediv').offsetWidth
    document.getElementById('picturediv').style.left=scrollerleft+scrollerwidth+"px"
	clipleft=0
	clipright=0
	document.getElementById('picturediv').style.clip ="rect("+cliptop+"px "+clipright+"px "+clipbottom+"px "+clipleft+"px)"
    scrollpicture()
}

picturecontent=""
picturecontent+="<table cellpadding=2 cellspacing=0>"
picturecontent+="<tr>"
for (i=0;i<=picture.length-1;i++) {
	picturecontent+="<td>"
	picturecontent+="<a href=\""+picture[i].linkto+"\" onMouseOver=\"javascript:onmsover()\" onMouseOut=\"javascript:onmsout()\">"
	picturecontent+="<img src=\""+picture[i].imgurl+"\" border=0 class='imagestyle'></a>"
	picturecontent+="</td>"
}
picturecontent+="</tr>"
picturecontent+="<tr>"
for (i=0;i<=picture.length-1;i++) {
	picturecontent+="<td class='textstyle'>"
	picturecontent+=picture[i].comment
	picturecontent+="</td>"
}
picturecontent+="</tr>"
picturecontent+="</tr></table>"

if (ie || ns6) {
	document.write('<div class="boxstyle" style="position:relative;width:'+scrollerwidth+'px;height:'+scrollerheight+'px;overflow-x:hidden">')
	document.write('<div id="picturediv" style="position:absolute;top:0px;left:0px;height:'+scrollerheight+'px;visibility:hidden;overflow-x:hidden;">'+picturecontent+'</div>')
	if (ie) {
		for (i=0;i<=translayersmax;i++) {
		document.write('<span ID="trans'+i+'" style="position:absolute;top:0px;left:'+translayersleftpos+'px;width:'+translayerswidth+'px;height:'+scrollerheight+'px;background-color:'+transparentzone_color+';filter:alpha(opacity='+translayersopacity+');overflow:hidden"> </span>')
		translayersleftpos+=translayerswidth
		translayersopacity-=translayersfactor
		}
		translayersleftpos=scrollerwidth-translayersleftpos
		for (ii=0;ii<=translayersmax;ii++) {
		document.write('<span ID="trans'+ii+'" style="position:absolute;top:0px;left:'+translayersleftpos+'px;width:'+translayerswidth+'px;height:'+scrollerheight+'px;background-color:'+transparentzone_color+';filter:alpha(opacity='+translayersopacity+');overflow:hidden"> </span>')
		translayersleftpos+=translayerswidth
		translayersopacity+=translayersfactor
		}
	}
	if (ns6) {
		for (i=0;i<=translayersmax-1;i++) {
		document.write('<span ID="transleft'+i+'" style="position:absolute;top:0px;left:'+translayersleftpos+'px;width:'+translayerswidth+'px;height:'+scrollerheight+'px;background-color:'+transparentzone_color+';opacity:'+translayersopacity/100+';overflow:hidden"> </span>')
		translayersleftpos+=translayerswidth
		translayersopacity-=translayersfactor
		if (translayersopacity<0) {translayersopacity=0.001}
		}
		translayersleftpos=scrollerwidth-translayersleftpos
		translayersopacity=0.001
		for (i=0;i<=translayersmax-1;i++) {
		document.write('<span ID="transright'+i+'" style="position:absolute;top:0px;left:'+translayersleftpos+'px;width:'+translayerswidth+'px;height:'+scrollerheight+'px;background-color:'+transparentzone_color+';opacity:'+translayersopacity/100+';"> </span>')
		translayersleftpos+=translayerswidth
		translayersopacity+=translayersfactor
		}
	}
	document.write('</div>')
	document.write('<div id="emptypicturediv" style="position:absolute;top:0px;left:0px;height:'+scrollerheight+'px;visibility:hidden">'+picturecontent+'</div>')

	window.onload=init
}





