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

[Greywacke]

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 December 31, 2012 by Pierre 'Greywacke' du Toit

[Greywacke]

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 December 31, 2012 by Pierre 'Greywacke' du Toit

[Greywacke]

ok - success at last! 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 December 31, 2012 by Pierre 'Greywacke' du Toit