PDA

View Full Version : Resolved Can I get Simple Controls Gallery v1.3 to run with jQuery v1.3.2 instead of 1.2.6?



chpo
12-28-2009, 09:17 AM
1) Script Title: Simple Controls Gallery v1.3

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

3) Describe problem:
Hi, thank you for this cool gallery script!
I wonder if there is any chance the script would run with a different version of jQuery than 1.2.6, i.e. 1.3.2?
I have integrated it into a WordPress test site (http://test.sackermann.de/en/fine-arts/malerei/jerba) and it works fine only does the page have to load 2 different versions of the jQuery library now, which I'm afraid might cause problems in the future.
I'm not a javascript programmer myself, but I can read and modify JS alright, so don't hesitate to put me to work. ;)
Thanks for your advice!

ddadmin
12-28-2009, 10:09 AM
Simple Controls Gallery should work with jQuery 1.3.2 as is already actually. For example, this works for me:


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<style type="text/css">

/*Make sure your page contains a valid doctype at the top*/
#simplegallery1{ //CSS for Simple Gallery Example 1
position: relative; /*keep this intact*/
visibility: hidden; /*keep this intact*/
border: 10px solid darkred;
}

#simplegallery1 .gallerydesctext{ //CSS for description DIV of Example 1 (if defined)
text-align: left;
padding: 2px 5px;
}

</style>

<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>

<script type="text/javascript">

var mygallery=new simpleGallery({
wrapperid: "simplegallery1", //ID of main gallery container,
dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
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: [true, 2500, 2], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
oninit:function(){ //event that fires when gallery has initialized/ ready to run
//Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
},
onslide:function(curslide, i){ //event that fires after each slide is shown
//Keyword "this": references current gallery instance
//curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
//i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
}
})

</script>

<body>

<div id="simplegallery1"></div>

chpo
12-28-2009, 12:53 PM
Thanks for the quick reply!
Strange, that call works for me as well. But if I try to rely on the built-in jquery-call of WordPress, nothing works at all.

I assume this gets off-topic now, since the script itself doesn't seem to be the problem. Just one more description, maybe this has come to your ears before. If not, give me the thumbs-down. ;)

WordPress generates a jquery-call via PHP into the head-section of the page:

<?php wp_head() ?>
With that function several script-calls are generated, i.e:

<script type="text/javascript" src="[mydomain]/wp-includes/js/jquery/jquery.js?ver=1.3.2"></script>
<script type='text/javascript' src='[mydomain]/wp-content/plugins/[myplugin]/jquery-1.2.6.js?ver=1.2.6'></script>
<script type="text/javascript" src="[mydomain]/wp-content/plugins/[myplugin]/simplegallery.js?ver=1.3"></script>

The first one comes from WP itself, the latter two I added via a PHP-hook. If I remove the 1.2.6-call from that hook, I get:

<script type="text/javascript" src="[mydomain]/wp-includes/js/jquery/jquery.js?ver=1.3.2"></script>
<script type="text/javascript" src="[mydomain]/wp-content/plugins/[myplugin]/simplegallery.js?ver=1.3"></script>

which should work alright, but it doesn't. The gallery just doesn't appear. Seems to me like simplegallery.js doesn't get a connection with jquery.

Thanks a bunch for any more ideas, I'm somewhat stuck here. :confused:

jscheuer1
12-28-2009, 03:41 PM
The easiest way to start figuring this out would be if we had a link to the page using this:


<script type="text/javascript" src="[mydomain]/wp-includes/js/jquery/jquery.js?ver=1.3.2"></script>
<script type="text/javascript" src="[mydomain]/wp-content/plugins/[myplugin]/simplegallery.js?ver=1.3"></script>

Then we could see what scripts are actually being used by that page.

chpo
12-28-2009, 05:38 PM
Thanks for responding! Here's the link:
http://test.sackermann.de/en/fine-arts/malerei/jerba
(Same as the link on the words "WordPress Test Site" in my initial post, but that might not have come across so well.)
The part in question is around line 60.

jscheuer1
12-28-2009, 05:55 PM
That version of jQuery has at its end:


jQuery.noConflict();

If you could remove that, it should work. But it would probably mess up other things you are doing or might do on this or other pages. And it might not be so easy to remove.

Here's an alternative. In the simplegallery.js file, find this line (bold) and add the highlighted:


(function($){
simpleGallery.prototype={

Then at the end of the file, add this:


})(jQuery);

chpo
12-28-2009, 08:03 PM
Perfect! Works like a charm. Thanks so much, John! :)

AshleyQuick
01-07-2010, 08:49 PM
This solution worked for me on Wordpress as well. Thanks and God Bless!!