/    Sign up×
Community /Pin to ProfileBookmark

slight change to Slideshow

Hi, I have a Slideshow that I want to modify a little, but am not sure how. I simply want to remove the row that allows users to select a still picture, and just leave the row that allows them to start and stop the Slidehshow.

The problem is, the row that allows users to select a still picture, is the piece of coding that lists all of the pictures and their destinations so that the actual slideshow can work. Is there any way of removing the drop down box, and table row from view on the Website, but still allow the slideshow to work?

Here is the coding –

(this is placed in HEAD)

<SCRIPT LANGUAGE=”JavaScript”>
<!– Original: Ricocheting ([email protected]) –>
<!– Web Site: [url]http://www.ricocheting.com[/url] –>

<!– This script and many more are available free online at –>
<!– The JavaScript Source!! [url]http://javascript.internet.com[/url] –>

<!– Begin
var rotate_delay = 5000; // delay in milliseconds (5000 = 5 secs)
current = 0;
function next() {
if (document.slideform.slide[current+1]) {
document.images.show.src = document.slideform.slide[current+1].value;
document.slideform.slide.selectedIndex = ++current;
}
else first();
}
function previous() {
if (current-1 >= 0) {
document.images.show.src = document.slideform.slide[current-1].value;
document.slideform.slide.selectedIndex = –current;
}
else last();
}
function first() {
current = 0;
document.images.show.src = document.slideform.slide[0].value;
document.slideform.slide.selectedIndex = 0;
}
function last() {
current = document.slideform.slide.length-1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
}
function ap(text) {
document.slideform.slidebutton.value = (text == “Stop”) ? “Start” : “Stop”;
rotate();
}
function change() {
current = document.slideform.slide.selectedIndex;
document.images.show.src = document.slideform.slide[current].value;
}
function rotate() {
if (document.slideform.slidebutton.value == “Stop”) {
current = (current == document.slideform.slide.length-1) ? 0 : current+1;
document.images.show.src = document.slideform.slide[current].value;
document.slideform.slide.selectedIndex = current;
window.setTimeout(“rotate()”, rotate_delay);
}
}
// End –>
</script>

(this is placed in BODY)

<form name=slideform>
<table cellspacing=1 cellpadding=4 bgcolor=”#000000″ bordercolor=”#999999″ border=”1″>
<tr>
<td align=center bgcolor=”000000″ bordercolor=”#666666″> <font color=”#FFFFFF”><b class=”text”>To
preview our work, simply click the ‘start’ button <br>
and watch our slideshow.</b></font></td>
</tr>
<tr>
<td align=center bgcolor=”#000000″ width=400 height=300> <img src=”images/pshoe.jpg” name=”show”>
</td>
</tr>
<tr>
<td align=center bgcolor=”#000000″>
<select name=”slide” onChange=”change();”>
<option value=”images/pshoe.jpg” selected>Shoe and Garter
<option value=”images/pready.jpg”>Getting Ready
<option value=”images/pflower.jpg”>Flower Girl
<option value=”images/pintimate.jpg”>Intimacy
<option value=”images/pcowboy.jpg”>Cowboy
<option value=”images/pgate.jpg”>Gate
<option value=”images/pcafe.jpg”>Cafe Scene
</select>
</td> (NB: I WANT TO GET RID OF THIS TABLE ROW AND FORM OPTION, BUT THE SLIDESHOW WON’T WORK WITHOUT IT)
</tr>
<tr>
<td align=center bgcolor=”#000000″>
<input type=button onClick=”first();” value=”|<<” title=”Beginning” name=”button”>
<input type=button onClick=”previous();” value=”<<” title=”Previous” name=”button”>
<input type=button name=”slidebutton” onClick=”ap(this.value);” value=”Start” title=”AutoPlay”>
<input type=button onClick=”next();” value=”>>” title=”Next” name=”button”>
<input type=button onClick=”last();” value=”>>|” title=”End” name=”button”>
</td>
</tr>
</table>
</form>
[COLOR=red](this is placed in BODY)[/COLOR]

to post a comment
JavaScript

7 Comments(s)

Copy linkTweet thisAlerts:
@LindaQauthorJan 29.2004 — If somebody has an alternate script, that is fine, but I thought it would be easier to simply remove that Table Row from an existing script that works well and that the Client likes.

I am happy for all suggestions.

Feel free to visit the page that shows the script at www.idodigital.com.au/preview.htm .

I eagerly await your reply,

Linda.
Copy linkTweet thisAlerts:
@LindaQauthorJan 30.2004 — Does anybody have any suggestions at all? Is there any other information that you need? I am really hoping to have an answer to this soon.

Linda.
Copy linkTweet thisAlerts:
@LindaQauthorFeb 02.2004 — Hi everybody,

I am really bumping this up at the moment. I haven't had one reply and this thread has been up for days, as you can see. I really do need help in this, could anybody help at all???

Linda.
Copy linkTweet thisAlerts:
@PittimannFeb 02.2004 — Hi!

It was just today I saw your thread.

The code below works like that: the images' paths and file names are put in the array at the beginning of the script. The select is replaced with a hidden form field which will receive the value, which formerly has been the selected index of the select.

I did not remove the buttons (beginning, previous, next, end) because I was not sure if you want that. You were talking about preventing the user from selecting a still picture but at the same time you stated that you only want to get rid of the table row with the select.

Here is the code:
[code=php]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
var imgArray=new Array("images/pshoe.jpg","images/pready.jpg","images/pflower.jpg","images/pintimate.jpg","images/pcowboy.jpg","images/pgate.jpg","images/pcafe.jpg");
var rotate_delay = 5000;// delay in milliseconds (5000 = 5 secs)
current = 0;
function next() {
if (document.slideform.slide.value<imgArray.length-1) {
document.images.show.src = imgArray[current+1];
document.slideform.slide.value = ++current;
}
else first();
}
function previous() {
if (current-1 >= 0) {
document.images.show.src = imgArray[current-1];
document.slideform.slide.value = --current;
}
else last();
}
function first() {
current = 0;
document.images.show.src = imgArray[0];
document.slideform.slide.value = 0;
}
function last() {
current = imgArray.length-1;
document.images.show.src = imgArray[current];
document.slideform.slide.value = current;
}
function ap(text) {
document.slideform.slidebutton.value = (text == "Stop") ? "Start" : "Stop";
rotate();
}
function change() {
current = document.slideform.slide.value;
document.images.show.src = imgArray[current];
}
function rotate() {
if (document.slideform.slidebutton.value == "Stop") {
current = (current == imgArray.length-1) ? 0 : current+1;
document.images.show.src = imgArray[current];
document.slideform.slide.value = current;
window.setTimeout("rotate()", rotate_delay);
}
}
//-->
</script>
</head>
<body>
<form name=slideform>
<table cellspacing=1 cellpadding=4 bgcolor="#000000" bordercolor="#999999" border="1">
<tr>
<td align=center bgcolor="000000" bordercolor="#666666"> <font color="#FFFFFF"><b class="text">To
preview our work, simply click the 'start' button <br>
and watch our slideshow.</b></font></td>
</tr>
<tr>
<td align=center bgcolor="#ffffff" width=400 height=300> <img src="images/pshoe.jpg" name="show">
</td>
</tr>
<tr>
<td align=center bgcolor="#000000">
<input type="text" name="slide" value=0>
</td>
</tr>
<tr>
<td align=center bgcolor="#000000">
<input type=button onClick="first();" value="|<<" title="Beginning" name="button">
<input type=button onClick="previous();" value="<<" title="Previous" name="button">
<input type=button name="slidebutton" onClick="ap(this.value);" value="Start" title="AutoPlay">
<input type=button onClick="next();" value=">>" title="Next" name="button">
<input type=button onClick="last();" value=">>|" title="End" name="button">
</td>
</tr>
</table>
</form>
</body>
</html>
[/code]

If you need further assistance, just post again.

Cheers - Pit
Copy linkTweet thisAlerts:
@LindaQauthorFeb 03.2004 — Thank you Pit,

I really appreciate your reply. It worked! But, I did make one change and something you said triggered me off. I thought I should post it in case somebody else finds this thread in the archives and wants to use the same code.

As you said, the field should be made hidden. That is a simple html thing, and I can't believe I didn't think of it (when you work on your own and stare at the screen all day, sometimes the simplest of things stump you).

So, in the line in the body script, where it has the form field for the still images that I wanted to get rid of, I simply put type=hidden instead of type=text. Then I was able to move that hidden field down next to the start/stop buttons, allowing me to delete that top row.

And, it all works perfectly now. Thanks!

Linda.
Copy linkTweet thisAlerts:
@PittimannFeb 03.2004 — Hi!

You're welcome! Sorry - I simply forgot to change the text field to a hidden one before posting.

I used it as a text field for testing, if I mistyped something...

Cheers - Pit
Copy linkTweet thisAlerts:
@dark_182_88Apr 27.2005 — hey...i have a problem too...i hope that somebody could help me...the thing is, i am using the same script, but i want to change the images of the button for the next, previous, last, n first, and i forgot how to do that, can anyone help please?

how do i keep the onclick function but put it on an image, i duno if u understand
×

Success!

Help @LindaQ spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...