addressalign-toparrow-leftarrow-leftarrow-right-10x10arrow-rightbackbellblockcalendarcameraccwcheckchevron-downchevron-leftchevron-rightchevron-small-downchevron-small-leftchevron-small-rightchevron-small-upchevron-upcircle-with-checkcircle-with-crosscircle-with-pluscontroller-playcredit-cardcrossdots-three-verticaleditemptyheartexporteye-with-lineeyefacebookfolderfullheartglobe--smallglobegmailgooglegroupshelp-with-circleimageimagesinstagramFill 1languagelaunch-new-window--smalllight-bulblightning-boltlinklocation-pinlockm-swarmSearchmailmediummessagesminusmobilemoremuplabelShape 3 + Rectangle 1ShapeoutlookpersonJoin Group on CardStartprice-ribbonprintShapeShapeShapeShapeImported LayersImported LayersImported Layersshieldstar-shapestartickettrashtriangle-downtriangle-uptwitteruserwarningyahooyoutube

Re: [php-49] Lightboxes, what lightbox?

From: Mark S.
Sent on: Monday, March 11, 2013, 11:47 AM
If you are using jquery there's a couple of functions (depending on what version you are using) that can help with this:

on (1.9+) or live (earlier than 1.9): http://api.jquery.com/on/

They basically monitor the DOM for you and add events that you want to the elements.

$("table").on( 'click', 'td a', function(e){
        // bind some events
    })

This allows you not to have to worry about binding events to objects in the dom in the right order, which can be helpful if you have a lot of things happening on a page. As you can imagine from a performance point of view, individually controlling when you are binding events is better than having something monitor your page, but it's a nice bit of functionality.



On Sun, Mar 10, 2013 at 5:04 PM, max steinmetz <[address removed]> wrote:
Thank you Tim, very much appreciated.



On Mar 9, 2013, at 12:05 PM, Tim Piele <[address removed]> wrote:

Yeah I think you're understanding it. The action (popup the light box) needs to act upon fully loaded DOM elements, it would be like trying to roast hot dogs that were still on their way home from the store in your wife's car. I know, weird analogy, I'm weird, but you get the point. Images cannot be used or manipulated until they fully exist in the DOM. That's part of the trouble learning Ajax, it's asynchronous so stuff doesn't always happen in logical order.

Sent from my iPhone

On Mar 9, 2013, at 11:21 AM, max steinmetz <[address removed]> wrote:

To quote everyone i can remember form High School when we were caught by total surprise, 'OMG! THAT SO WORKED!'

So the problem was that I was initializing the lightbox as it was in the unload function BEFORE the images were there? I thought plugging the initialization in made it available to what was to come, but If i'm understanding what you're explaining, I needed to have the material first to be available to the effect not that the effect should be available to the material. I'm sure i'm screwing up some of this as i try to understand it. But it completely worked.

Thank you so much. I'll have to research thing (along with everything else more) but at least i'm beginning to finally make some headway in to things beyond just html. Again thank you Shivass. Thank you very much.


On Mar 9, 2013, at 1:16 AM, Shivaas Gulati <[address removed]> wrote:

Hi Max

The issue is that you're loading the table images using ajax, but you're calling lightbox even before the images have been loaded in the DOM. A potential solution would be to move $('.lightbox').lightBox(); to parseExamples(). Try something like:

$(function()
{
//get jason data
showExamples("json/ori-animal.js");
$("#origami_examples a").click(showExampleCategory);
});
function parseExamples(data)
{
//pass parameters, get back data
$.each (data.examples, addExample);

// initialize lightbox after the elements have been inserted into the DOM
$('.lightbox').lightBox();
}


Cheers,

Shivaas Gulati
--------------------------------------------------
co-founding Engineer, Remitly
http://about.me/shivaas


On Sat, Mar 9, 2013 at 12:53 AM, max steinmetz <[address removed]> wrote:

Hey everyone,

is anyone good with lightboxs? I'm working on a school project in which i have to build a table with data using json to produce a table, and image links. If you click the image, it then triggers a lightbox of the image. I've gotten everything working up to the final lightbox (which you can see here at the top of the page: http://www.maxworks.org/scc/test4/index.html). I've tested stuff individually, and in parts and everything seems to work ok. But for whatever reason, the image links inside the table (it has to be in a table, part of the assignment), when clicked send me to another page instead of triggering the light box effect. I'm not getting any errors, or if i am i'm not recognizing them as errors which would cause a problem.

Any help would be appreciated. Its probably very stupid like a colon in the wrong place or a typo. I could uses some eyes and guidance. Thanks form a newb.


test url: http://www.maxworks.org/scc/test4/


--
Please Note: If you hit "REPLY", your message will be sent to everyone on this mailing list ([address removed])
http://www.meetup.com/php-49/
This message was sent by max steinmetz ([address removed]) from The Seattle PHP Meetup Group.
To learn more about max steinmetz, visit his/her member profile: http://www.meetup.com/php-49/members/2821890/
Set my mailing list to email me

As they are sent
http://www.meetup.com/php-49/list_prefs/?pref=1

In one daily email
http://www.meetup.com/php-49/list_prefs/?pref=2

Don't send me mailing list messages
http://www.meetup.com/php-49/list_prefs/?pref=0
Meetup, POB 4668 #37895 NY NY USA 10163 | [address removed]






--
Please Note: If you hit "REPLY", your message will be sent to everyone on this mailing list ([address removed])
This message was sent by Shivaas Gulati ([address removed]) from The Seattle PHP Meetup Group.
To learn more about Shivaas Gulati, visit his/her member profile
Set my mailing list to email me As they are sent | In one daily email | Don't send me mailing list messages

Meetup, POB 4668 #37895 NY NY USA 10163 | [address removed]





--
Please Note: If you hit "REPLY", your message will be sent to everyone on this mailing list ([address removed])
This message was sent by max steinmetz ([address removed]) from The Seattle PHP Meetup Group.
To learn more about max steinmetz, visit his/her member profile
Set my mailing list to email me As they are sent | In one daily email | Don't send me mailing list messages

Meetup, POB 4668 #37895 NY NY USA 10163 | [address removed]




--
Please Note: If you hit "REPLY", your message will be sent to everyone on this mailing list ([address removed])
This message was sent by Tim Piele ([address removed]) from The Seattle PHP Meetup Group.
To learn more about Tim Piele, visit his/her member profile
Set my mailing list to email me As they are sent | In one daily email | Don't send me mailing list messages

Meetup, POB 4668 #37895 NY NY USA 10163 | [address removed]





--
Please Note: If you hit "REPLY", your message will be sent to everyone on this mailing list ([address removed])
This message was sent by max steinmetz ([address removed]) from The Seattle PHP Meetup Group.
To learn more about max steinmetz, visit his/her member profile
Set my mailing list to email me As they are sent | In one daily email | Don't send me mailing list messages

Meetup, POB 4668 #37895 NY NY USA 10163 | [address removed]



--
-----------------------------------------
Mark Steudel
P:[masked]
F:[masked]
[address removed]

. : Adoption Updates : .
http://www.steudel.org/blog

. : Work : .
http://www.mindfulinteractive.com

. : LinkedIn : .
http://www.linkedin.com/in/steudel

People in this
group are also in: