View Full Version : Resolved How to remove play/pause in Simple Controls Gallery

06-10-2009, 11:33 PM
1) Script Title: Simple Controls Gallery v1.3

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/simplegallery.htm

3) Describe problem: I wish to remove the play/pause function on the navigation panel, and only have the prev/next buttons with the image status/counter replacing the play/pause button.

I am very rusty on js stuff and have not found the answer, removing the nav panel results in the script not showing the images. I recognise there appear to be various parts of the code that are interlinked, I have been unable to successfully remove the correct parts.

I know it may sound rather odd, as I guess there must have been a time when someone said the exact opposite.

I would appreciate any help please.

06-12-2009, 10:36 AM
I assume that the problem is not an easy one! Would be a pity as its a neat script and almost perfect for the project I am working on.

Surely someone must know how to do this, or is it impossible without a complete re-write?

If not, does anyone know of a similar script with prev/next buttons but no play/pause/auto scroll.

06-13-2009, 06:37 AM
It's not quite so simple unfortunately, since the Play/ Pause buttons and the Status Counter exists inside two different DIVs and are treated by the script as separate "objects". Combining the two involves more than just rearranging the output of the HTML. Anyhow, I'll try and see if I can come up with the changes this weekend.

06-14-2009, 03:12 AM
Ok, as promised, try the below modified .js file, which removes the pause/play buttons, and brings the status counter to within the same line as the next/prev buttons. You may want to edit the following line to tweak the spacing between the 3 controls:

interfaceHTML+='<span class="gallerystatus" style="margin-right:5px">' + (setting.curimage+1) + '/' + setting.imagearray.length + '</span> '

06-14-2009, 09:12 PM
ddadmin - Thank you for much. However, just one thing, the status image count x/x does not move. I ran a clean test on a new html, but no change.
On checking the code:

if (i==1)
interfaceHTML+='<span class="gallerystatus" style="margin-right:5px">' + (setting.curimage+1) + '/' + setting.imagearray.length + '</span> '

The <span> replacing the <div>, is the only change I noted, but for some strange reason nothing happens!

Do you know why this would be so?

06-15-2009, 04:17 AM
Hmm the status portion increments for me. Actually, there is another change to the code other than what you had mentioned. Specifically:

return setting.$navpanel.find('img.navimages, span.gallerystatus').get()

06-15-2009, 07:49 PM
ddadmin - Try as I may, I cannot get the status to increment. I have used a brief test html page (copied below). For testing clarity, I have left the standard simplegallery.js as named whilst renaming the modified version to simplegallery_mod.js.

If I run with simplegallery.js, the status increments, if I swap script to simplegallery_mod.js everything works except the increment.

If you can find the time, do you have any idea as to what may be causing this problem? I re-downloaded the mod file today and still no difference.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<script type="text/javascript" src="../jquery/jquery-1.3.2.js"></script>

<style type="text/css">
#simplegallery1{ //CSS for Simple Gallery Example 1
position: relative; /*keep this intact*/
visibility: hidden; /*keep this intact*/
border: 10px solid darkred;

<script type="text/javascript" src="simplegallery_mod.js">
<!--<script type="text/javascript" src="simplegallery.js">-->

* Simple Controls Gallery- (c) 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 this script and 100s more

<script type="text/javascript">
var mygallery=new simpleGallery({
wrapperid: "simplegallery1",
dimensions: [250, 180],
imagearray: [
["http://i26.tinypic.com/11l7ls0.jpg", "http://en.wikipedia.org/wiki/Swimming_pool", "_new", "There's nothing like a nice swim in the Summer."],
["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "", ""],
["http://i30.tinypic.com/531q3n.jpg", "", "", "Eat your fruits, it's good for you!"],
["http://i31.tinypic.com/119w28m.jpg", "", "", ""]
autoplay: [false, 2500, 2],
persist: false,
fadeduration: 500,
onslide:function(curslide, i){
<div id="simplegallery1"></div>

06-15-2009, 09:34 PM
Can you upload a demo page containing the modified .js file, so I can see what the issue is live?

06-15-2009, 10:13 PM
DD Admin - thanks for taking a look. The file is Vista Zipped with jquery plus nav images. I have included the js script within the html page (retested, but no luck).

06-15-2009, 11:10 PM
Ah ok I've finally found the problem. You're using jQuery 1.3.2 with this script, which changes slightly the order in which some elements are returned. As a result, the status portion is no longer found in the expected position by the script. Anyhow, inside the .js file, try finding the following line:

setting.navbuttons[3].innerHTML=(setting.curimage+1) + '/' + setting.imagearray.length

and change that to:

setting.navbuttons[2].innerHTML=(setting.curimage+1) + '/' + setting.imagearray.length

This change is only needed if you're using jQuery 1.3.2, and not 1.2.6.

06-15-2009, 11:31 PM
DD Admin - Thanks, it now works fine in my project. There was no way I would have worked that one out!! You are a genius.