asked on

JQuery colorbox - accessing element click from remote page

HI

We are using the JQuery Colorbox modal window plugin.

We are calling a colorbox to load a page to display in the modal window. Once the window has loaded we want to be able to detect a click / manipulate elements in the page that has loaded.

In the code example I am trying to get to work there is a <div> in the loaded page (logoutoptions.asp) called <div id="autologoutcancel">. This is what we are trying to detect a click on. But this is not working....

Can anyone point me in the right direction.

Thanks
Craig

// JavaScript Document
function AutoLogoutPrompt () {
	// Call colorbox with logoutoptions
	$.fn.colorbox({href:'logoutoptions.asp',transition:"elastic", width:"750", height:"520", initialWidth:"700", initialHeight:"480"}, function() {
																																										 		 // If autologoutcancel clicked yes then run AutoLogoutCancel
		 $("#autologoutcancel").click(function() {
					// Alert for testing purposes						   		
					alert("Logout cancelled");
		 });																																										
		
		 // If nothing clicked in 30 seconds then run AutoLogOut
		 setTimeout(AutoLogout,5000);	
	});
};

Open in new window

StealthyDev

Do you want to activate the click event?

ASKER CERTIFIED SOLUTION

StealthyDev

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

StealthyDev

Hi, after analysis, there is an event onComplete in colorbox.

You can use the below code.

Best Regards.

$.fn.colorbox({
	href:'logoutoptions.asp',
	transition:"elastic",
	width:"750",
	height:"520",
	initialWidth:"700",
	initialHeight:"480",
	onComplete: function(){
		$("#autologoutcancel").click(function() {
			// Alert for testing purposes						   		
			alert("Logout cancelled");
		});
		// If nothing clicked in 30 seconds then run AutoLogOut
		setTimeout(AutoLogout,5000);
	}
});

Open in new window

craig32768

ASKER

That's great - thanks!