Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Please help with blending image script

Reply
Thread Tools

Please help with blending image script

 
 
CK
Guest
Posts: n/a
 
      08-02-2007
1) Script Title: Blending Image Slideshow

2) (see script below)
Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/image4.htm

3) Describe problem:
could anyone tell me how i can change the speed of the motion halfway
through? basically i want the text to read quickly and the images to
read slowly so I need to change the motion speed at 'fade image 17' of
this script below, any hints/alternatives greatly appreciated. x

<script language="JavaScript1.2" type="text/javascript">

/***********************************************
* Fade-in image slideshow script- Dynamic Drive DHTML code library
(www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source
code
***********************************************/

var slideshow_width='650px' //500
var slideshow_height='180px' //475
var pause=250//SET PAUSE BETWEEN SLIDE (3000=3 seconds)

var fadeimages=new Array()
//SET 1) IMAGE PATHS, 2) optional link, 3), optional link target:
fadeimages[0]=["images/if.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[1]=["images/you.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[2]=["images/could.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[3]=["images/describe.jpg", "http://
www.commissionyourown.com/exhibition.htm", ""] //image with link
syntax
fadeimages[4]=["images/yourself.jpg", "http://
www.commissionyourown.com/exhibition.htm", ""] //image with link
syntax
fadeimages[5]=["images/through.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[6]=["images/art.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[7]=["images/comma.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[8]=["images/which.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[9]=["images/style.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[10]=["images/would.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[11]=["images/you2.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[12]=["images/chose.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[13]=["images/dot.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[14]=["images/dot2.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[15]=["images/dot3.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[16]=["images/questionmark.jpg", "http://
www.commissionyourown.com/exhibition.htm", ""] //image with link
syntax
fadeimages[17]=["images/Ad1.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax[/
b]fadeimages[18]=["images/Ad2.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[19]=["images/Ad3.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[20]=["images/Ad4.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[21]=["images/Ad5.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[22]=["images/Ad6.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[23]=["images/Ad7.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[24]=["images/Ad9.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax
fadeimages[25]=["images/Ad10.jpg", "http://www.commissionyourown.com/
exhibition.htm", ""] //image with link syntax




////NO need to edit beyond here/////////////

var preloadedimages=new Array()
for (p=0;p<fadeimages.length;p++){
preloadedimages[p]=new Image()
preloadedimages[p].src=fadeimages[p][0]
}

var ie4=document.all
var dom=document.getElementById

if (ie4||dom)
document.write('<div style="position:relative;width:'+slideshow_width
+';height:'+slideshow_height+';overflow:hidden"><d iv id="canvas0"
style="position:absolute;width:'+slideshow_width
+';height:'+slideshow_height+';top:0;left:0;filter :alpha(opacity=10);-
moz-opacity:10"></div><div id="canvas1"
style="position:absolute;width:'+slideshow_width
+';height:'+slideshow_height+';top:0;left:0;filter :alpha(opacity=10);-
moz-opacity:10;visibility: hidden"></div></div>')
else
document.write('<img name="defaultslide" src="'+fadeimages[0][0]+'">')

var curpos=10
var degree=10
var curcanvas="canvas0"
var curimageindex=0
var nextimageindex=1

function fadepic(){
if (curpos<100){
curpos+=10
if (tempobj.filters)
tempobj.filters.alpha.opacity=curpos
else if (tempobj.style.MozOpacity)
tempobj.style.MozOpacity=curpos/101
}
else{
clearInterval(dropslide)
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) :
document.getElementById(nextcanvas)
tempobj.innerHTML=insertimage(nextimageindex)
nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex
+1 : 0
var tempobj2=ie4? eval("document.all."+nextcanvas) :
document.getElementById(nextcanvas)
tempobj2.style.visibility="hidden"
setTimeout("rotateimage()",pause)
}
}

function insertimage(i){
var tempcontainer=fadeimages[i][1]!=""? '<a href="'+fadeimages[i]
[1]+'" target="'+fadeimages[i][2]+'">' : ""
tempcontainer+='<img src="'+fadeimages[i][0]+'" border="0">'
tempcontainer=fadeimages[i][1]!=""? tempcontainer+'</a>' :
tempcontainer
return tempcontainer
}

function rotateimage(){
if (ie4||dom){
resetit(curcanvas)
var crossobj=tempobj=ie4? eval("document.all."+curcanvas) :
document.getElementById(curcanvas)
crossobj.style.zIndex++
tempobj.style.visibility="visible"
var temp='setInterval("fadepic()",50)'
dropslide=eval(temp)
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"
}
else
document.images.defaultslide.src=fadeimages[curimageindex][0]
curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0
}

function resetit(what){
curpos=10
var crossobj=ie4? eval("document.all."+what) :
document.getElementById(what)
if (crossobj.filters)
crossobj.filters.alpha.opacity=curpos
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=curpos/101
}

function startit(){
var crossobj=ie4? eval("document.all."+curcanvas) :
document.getElementById(curcanvas)
crossobj.innerHTML=insertimage(curimageindex)
rotateimage()
}

if (ie4||dom)
window.onload=startit
else
setInterval("rotateimage()",pause)

</script>

 
Reply With Quote
 
 
 
 
Bergamot
Guest
Posts: n/a
 
      08-03-2007
CK wrote:
> 1) Script Title: Blending Image Slideshow
> could anyone tell me how i can change


FYI, comp.lang.javascript is over there ->

--
Berg
 
Reply With Quote
 
 
 
Reply

Thread Tools

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

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Question about alpha blending and low level drawing on widgets Gabriele Farina *DarkBard* Python 3 07-01-2004 04:16 AM
blending 2 images JavaJug Java 2 06-04-2004 07:24 AM
ALPHA-BLENDING ?? Ixon HTML 7 11-26-2003 12:35 PM
Blending Java with Tcl! Help! AJ Java 0 11-06-2003 07:20 PM
Video blending David Burgess Java 0 10-21-2003 11:48 PM



Advertisments