PDA

View Full Version : Conveyer Belt Slideshow background img instead of color



samix
07-30-2008, 06:18 AM
hi guys
can any one help me out with this?

1) Script Title: Conveyor belt slide show

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/leftrightslide.htm

3) Describe problem: How to modify this javascript to use a background image for the moving thumbnails instade of just a color?


thanks 4 your help

jscheuer1
07-30-2008, 06:49 AM
In this line (highlighted):


if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div style="position:relative;width:'+sliderwidth+';height:'+sliderheight+';overflow:hidden">')
write('<div style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';background-color:'+slidebgcolor+'" onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed">')
write('<div id="test2" style="position:absolute;left:0px;top:0px"></div>')
write('<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilaye

Change background-color to just background. So you have:


write('<div style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';background:'+slidebgcolor+'" onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed">')

Once you have that, you can use standard css style background properties (including an image URL) in this part of the script:


//configure background color:
slidebgcolor="#EAEAEA"

Example:


//configure background color:
slidebgcolor="url('some.gif')"

samix
07-30-2008, 07:20 AM
thanks 4 replying
sorry for that question that may be silly
but i'm still new in scripts world...
if the image is in the directory
http://www.xxxxxx.com/test.gif

what i should write?

slidebgcolor="('http://www.xxxxxx.com/test.gif')"
or
slidebgcolor="http://www.xxxxxx.com/test.gif"


thanks

jscheuer1
07-30-2008, 12:38 PM
Neither. Use a standard quoted css background style string:


slidebgcolor="url('http://www.xxxxxx.com/test.gif')"

This will also work:


slidebgcolor="url(http://www.xxxxxx.com/test.gif)"

You can include anything that is valid for the background style property. So you can include other valid values:


slidebgcolor="white url(http://www.xxxxxx.com/test.gif) repeat-x center center"

For more on possible values for the css background style property, see your favorite css style reference or:

http://www.eskimo.com/~bloo/indexdot/css/properties/colorbg/bg.htm

samix
07-30-2008, 02:21 PM
thanks 4 your great help ..
sorry for not explaining what exactly i need from the beginning
what exactly i need is forcing the slde images to slide inside a certain area in the background image (see the below image)

http://i36.tinypic.com/242917o.gif

to be just like a movie sliding+keeping the background image and slide show to be resizable with every screen resolution the user use...(Note I'm using the script you edited for some one to Specify the slider's width (in pixels or %) not the one has the width only in pixels
here it is
http://www.dynamicdrive.com/forums/showthread.php?t=6813&highlight=Conveyor+Belt+Script+width+percent
i logged to the test page which made by the topic starter which is in the post No. 10 and copyed the code from it and now i'm using it after deleting the top blue frame image .....
so, what do you recomend?
thanks alot