CODEWITHSUNDEEP
jqueryfirefoxjoomlaoperaflickr
Codrguy
Codrguy

Reputation: 669

why wouldn't this work in Firefox and Opera?

So the gallery section of the joomla site i am working on (www.arrowandbranch.com/joomla/gallery) uses jquery and flickr API. the sites works and looks fine in IE, Safari and Chrome, but not in FireFox and Opera. Specifically, in FF and Opera, clicking the thumbnail picture or the title of the albums doesn't load the pictures in the left box as it should.

Any ideas as what i am doing wrong here?

Upvotes: 1

Views: 159

Answers (1)

Hugo Migneron
Hugo Migneron

Reputation: 4907

The code that triggers your javascript is what's causing the problem.

The thumbnail picture on the right has the following markup : 

<a onclick=" $(document).ready(function(){ $('#photo2').flickrGallery({ useFlickr: 'true', flickrAPIKey: '2dc6307382340967ed44d0df77f888bf', photosetID: '72157625589504841', useHoverIntent: 'true', useLightBox: 'true'   });  }); " href="#">                      
    <img style="width: 100px; height: 100px;" alt="" src="http://farm6.static.flickr.com/5207/5310233198_7f8f2295ed_s.jpg" class="album-pic">        
</a>

The problem comes from the onclick event. You are telling it to execute on $(document).ready which isn't really what you want. $(document).ready executes when the page first loads. If an event is triggered by a click, then just use onclick without $(document).ready.

<a onclick="$('#photo2').flickrGallery({ useFlickr: 'true', flickrAPIKey: '2dc6307382340967ed44d0df77f888bf', photosetID: '72157625589504841', useHoverIntent: 'true', useLightBox: 'true'  });" href="#">                      
    <img style="width: 100px; height: 100px;" alt="" src="http://farm6.static.flickr.com/5207/5310233198_7f8f2295ed_s.jpg" class="album-pic">        
</a>

will work fine.

Upvotes: 2

Related Questions