Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home › Forums › JavaScript › Dynamic content: how to get javascript functions working?

  • This topic is empty.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • April 6, 2011 at 3:46 pm #32257
    jeroen1990
    Member

    on this site there’s a screencast about dynamic content:
    https://css-tricks.com/video-screencasts/85-best-practices-dynamic-content/

    it works fine but there are alot of people having the same problem as me and have no clue how to solve it..
    when you load a page that has javascript functions they won’t work!
    I already wasted so many hours of googling for the answer but still no luck. I read about replacing .bind() with .live() but didn’t get it to work..anyone?!

    April 6, 2011 at 4:49 pm #51993
    TT_Mark
    Member

    Are you saying you’re loading new Javascript functions within the Dynamic Content? i.e. you click a button that brings in new content and in that content is a script tag with a Javascript function?

    Or, when you load in the dynamic content, existing events like mouseover and click will not fire on the fire content?

    Got a live link to the site or code?

    April 6, 2011 at 5:13 pm #51999
    jeroen1990
    Member

    Hey TT_Mark,
    In the new content is f.e. a lightbox plugin but it doesn’t work..same for all plugins

    you can see it here: https://css-tricks.com/examples/DynamicPage/

    code is here: https://css-tricks.com/dynamic-page-replacing-content/

    Thanks!

    April 7, 2011 at 3:40 pm #51869
    TT_Mark
    Member

    Hmm…so in the new content you have some ‘inline’ Javascript? or its actually linking to an external script e.g.

    I dont think the latter will work, not sure if the former works either…

    Can you not have the plugin always in the source code, whatever content is showing?

    April 7, 2011 at 7:23 pm #51875
    Chris Coyier
    Keymaster

    It really is all about using .live() or .delegate(), or rebinding events every time you load in new content.

    I haven’t look at that tutorial in a while, but I’m sure it uses .load() to pull in HTML from the other pages. With .load() you can declare a callback function. Callback functions are functions that fire once the function calling it is totally done doing it’s thing, meaning in this case the HTML has been injected and it’s ready to go. In that callback function, you’d re-bind any events attached to elements that you need to work.

    April 7, 2011 at 8:23 pm #51879
    jeroen1990
    Member

    Thanks for the reply’s! going to give it another try..

    April 10, 2011 at 4:43 pm #51659
    mohammad
    Member

    hi.how can add loading… image gif animation for this(https://css-tricks.com/examples/DynamicPage/) when content loading?

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.