Friday, March 29, 2013

creating Slide Show Using Java Script and CEWP

<script language="javascript" type="text/javascript">
<div 

// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 3000

// Duration of crossfade (seconds)
var crossFadeDuration = 3

// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = '/asrtech/images/smbox1.jpg'
Pic[1] = '/asrtech/images/smbox2.jpg'
Pic[2] = '/asrtech/images/smbox3.jpg'
Pic[3] = '/asrtech/images/smbox4.jpg'


// =======================================
// do not edit anything below this line
// =======================================

var t
var j = 0
var p = Pic.length

var preLoad = new Array()
for (i = 0; i < p; i++){
   preLoad[i] = new Image()
   preLoad[i].src = Pic[i]
}

function runSlideShow(){
   if (document.all){
      document.images.SlideShow.style.filter="blendTrans(duration=2)"
      document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)"
      document.images.SlideShow.filters.blendTrans.Apply()     
   }
   document.images.SlideShow.src = preLoad[j].src
   document.images.SlideShow.click = "http://www.google.com"
   if (document.all){
      document.images.SlideShow.filters.blendTrans.Play()
   }
   j = j + 1
   if (j > (p-1)) j=0
   t = setTimeout('runSlideShow()', slideShowSpeed)
}

_spBodyOnLoadFunctionNames.push("runSlideShow");

</script>&#160;<!-- the Slide Show --><table border="0" cellspacing="0" cellpadding="0"><tbody><tr><td width="300" height="300" id="VU"><img name="SlideShow" width="300" height="300" src="/Style%20Library/images/pic1.jpg" click="http://www.google.com" alt="" style="filter: blendtrans(duration=crossfadeduration)"/></td></tr></tbody></table>

No comments:

Post a Comment