Jump to content
Sign in to follow this  
Greywacke

javascript / jquery triggering single image loading on page load in joomla

Recommended Posts

hi there again... battling a bit with this issue, the category "contact us" from the joomgallery in the following joomla page loads:http://www.gamersedg...atid=3&Itemid=3but i am however, trying to make the single image in the category, automatically clicked on page load. i know triggering this is possible with jquery - but here follows my attempt after the page is loaded:

		<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>		<script language="javascript">		<!--		var q = "option=com_joomgallery&view=category&catid=3&Itemid=3";			// the querystring to check for		$(document).ready(function(){                                                           // perform onload of document				if (location.search.indexOf(q)>=0) {					// if querystring matches eg. valid page						$(".jg_catelem_photo").trigger('click');		// trigger jquery click on link				}		});		//-->		</script>

however, it instead breaks all the loading into lightbox as would happen if a thumbnail is clicked. i need to trigger this click onload, as if the user did it - eg that the image loads within the lightbox as currently happens when you go to the url and click on the thumbnail.... how would i emulate a click, but pass the rel="lightbox[joomgallery];" attribute of the link? 0o any help - asap, would be appreciated... thanks in advance,Pierre "Greywacke" du Toit

Edited by Pierre 'Greywacke' du Toit

Share this post


Link to post
Share on other sites

ok, after a quick google - i have come up with the following solution found at http://stackoverflow...it-were-clicked

                <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>                <script language="javascript">                <!--                var q = "option=com_joomgallery&view=category&catid=3&Itemid=3";                        // the querystring to check for                $(document).ready(function(){                                                           // perform onload of document                                if (location.search.indexOf(q)>=0) {                                    // if querystring matches eg. valid page                                                $("a.jg_catelem_photo[rel='lightbox[joomgallery];']").trigger('click');         // trigger jquery click on link                                }                });                //-->                </script>

lets see if this works, i'll report back as soon as i know ;) edit: unfortunately it does not, what am i doing wrong? 0o

Edited by Pierre 'Greywacke' du Toit

Share this post


Link to post
Share on other sites

ok - success at last! :dirol: seeing as jquery is not compliant with the version of joomgallery used, it had to be done in a cross-browser compliant, oldschool flavour, javascript.

<script language="javascript"><!--window.onload = function(){												   // add to onload of document  var q = "option=com_joomgallery&view=category&catid=3&Itemid=3";			// the querystring to check for  if (location.search.indexOf(q)>=0) {										// if querystring matches eg. valid page   var clicky = document.createEvent("HTMLEvents");						   // create event object clicky   var targetElement = document.getElementsByClassName('jg_catelem_photo');   // get target element   clicky.initEvent("click", true, true);									 // initiate event   targetElement[0].dispatchEvent(clicky);									// dispatch event   targetElement[0].click();												  // trigger click on link  }};//--></script>

this script, which is located in the body element after the elements to click have loaded, works in the following browsers: CHROME 23.0.1271.97 mFIREFOX 17.0.1SAFARI 5.1.7INTERNET EXPLORER 9.0.8112.16421 (64-bit)OPERA 12.11 if one is encountered where it does not work - please let me know, in this thread (at least it has been updated to work accross all 5 major browsers update versions and tested - with only ie9 being the exception) ;)

Edited by Pierre 'Greywacke' du Toit

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...