I am not a code-writer, I am a code-user and I found a code for a slideshow on javascripts.com that I would like to use but need altered just a bit.
In the code, the image size is the same height and width, but I need to make the width just a wee bit longer. Is there a way to alter this script to reflect a longer width easily?
Below is the script - you will see what I am talking about.
img_places=5 // number of image places in the display area
img_size=50 // size of the images, width and height are the same
img_spacer=2 // space between the images
scroll_all_images=1
// 0 = first_img_num to the last_img_num
// 1 = scroll through all images in the array
// if scroll_all_images is set at zero the following two lines define a set of images
first_img_num=1 // starting image number, 1 to number of images in the array
last_img_num=5 // ending image number
display_border=4 //
border_type="ridge" //
border_colour="#afa684" //
display_bgcol="#cfc8a6" // add colour to the space between the images
display_top=70 // top position must be stated
display_center=1 // 0 = no 1 = yes, if set at zero then display_left is used
display_left=100 // left position is over-ridden if display_center is set at 1
speed=1 // rate the images move
// ********** End Of User Defining Area **********
// ********** Editing beyond this line is not required **********
function newwin(loc){
if(loc==""){return}
//window.open(loc)
window.open(loc,'','left=200,top=200,width=200,height=200') // use for specific size and positioned window
}
// add onload="init()" and style="overflow-x:hidden" to the opening BODY tag
// place <script>init()</script> after the opening BODY tag
<BR><BR><BR><BR>
For more information pay a visit to <a href="www.huntingground.freeserve.co.uk/style/slideshow_multi.htm">The Huntingground</a>
<BR><BR>
<ul>
<li>You can choose how many images places are shown in the display area from one up to the number of images you have in the array.<BR>
The display area automatically resizes to accommodate this number of places.<BR>
These image places are used to scroll the images.
<P>My example is set to show 5 images places scrolling all 12 images.
<P><li>
You can scroll through all the images in the array or a define a set of images.<br>
To define a set of images you select the first and last image to be shown, the set of images scrolled is then both of these images and all the images between.<BR>
<P>Example:<BR>
Starting image = 3 ; Ending image = 8;<BR>
Images scrolled = 3,4,5,6,7, & 8
<P>You can have any number of images in a set.<BR>
If you have more image places than images in the set only the set images are shown.<BR>
If you have less image places than images in the set the remaining images in the set are still scrolled..<BR>
If you have the same image places as your image set then as an image disappears to the left you will see it re-entering from the right.<BR><BR>
<li>Each image can be assigned its own unique link.
<li>Mouse over stops the display, mouse out restarts the display
<P><li>User Options within the script
<P><ol>
<li><b>img_places</b>=5 // number of image places in the display area
<li><b>img_size</b>=50 // size of images, width and height are the same
<li><b>img_spacer</b>=2 // space between images
<li><b>scroll_all_images</b>=1<BR>
// 0 = scroll from first_img_num to last_img_num.<BR>
// 1 = scroll through all images in the array<BR><BR>
If <b><i>scroll_all_images</i></b> is set at zero the following two lines define a set of images
<li><b>first_img_num</b>=1 // starting image number, 1 to number of images in the array
<li><b>last_img_num</b>=2 // ending image number<BR><BR>
<li><b>display_border</b>=4 //
<li><b>border_type</b>="ridge" //
<li><b>border_colour</b>="#afa684" //<BR>
<li><b>display_bgcol</b>="#cfc8a6" // add colour to the space between the images<BR><BR>
<li><b>display_top</b>=100 // top position must be stated
<li><b>display_center</b>=1 // 0 = no 1 = yes, if set at zero then display_left is used
<li><b>display_left</b>=100 // left position is over-ridden if display_center is set at 1
<li><b>speed</b>=1 // rate the images move
</ol>
</ul>
<P>Enter your image and link info into the <b>data</b> array.
<P><center>data[num]=new Array("image.jpg","link.htm")</center>
<P>If no link is required leave the quotes empty
<P><center>data[num]=new Array("image.jpg","")</center>
After a cursory glance, I don't think it would be terribly difficult. Towards the top, there is a variable called "img_size", which notes that the width and height are the same. If you search the rest of the code for references to img_size, you'll find one in a line that sets height and another in a line that sets width.
So, if you duplicate the line that defines img_size, change one to img_height and the other to img_width, and then change the other references to img_size to the appropriate new variable, it should get you well on your way...
Thank you very much for your help Tweak4, it worked like a charm. Plus I learned something new today. Thank you again for helping me with this very simple task. Have a great day!
Javascript simple rewrite?
Hi there,
Reply With Quote
Thank you Tweak4 !!
Plus I learned something new today. 
Thank you again for helping me with this very simple task. Have a great day!
Bookmarks