Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Fredrik Esseen 594 posts 830 karma points
    Jun 26, 2009 @ 12:15
    Fredrik Esseen
    0

    Using Jquery LightBox and Tabs on same page

    Hi!

    I have a jquery tabs-function on my page and also a gallery with thumbnails which uses lightbox. When I have the tabfunction the gallery doesnt work. Im no wizard with javascript but it seems to me that the tabfunction overwrites something that the lightbox needs. I can show code but i was first thinking that someone might have an easy solution?

  • dandrayne 1138 posts 2262 karma points
    Jun 26, 2009 @ 12:32
    dandrayne
    0

    Got a link to a live example?

  • Fredrik Esseen 594 posts 830 karma points
    Jun 26, 2009 @ 12:47
  • dandrayne 1138 posts 2262 karma points
    Jun 29, 2009 @ 17:38
    dandrayne
    0

    Sorry, just found this again (lost on the new forum!)

    A very quick look didnt give any obvious clues as to why they aren't working, and I can't say I've worked with these particular plugins before.  I know its know what you want to hear but have you thought about changing the tabs plugin?  I can recommend the v. small library linked below.

    http://flowplayer.org/tools/demos/tabs/index.html

  • Shannon Deminick 1510 posts 5195 karma points hq
    Jun 29, 2009 @ 23:22
    Shannon Deminick
    0

    Yup, we're looking into refactoring a lot of the JS in the admin section and making everything jquery (so we can remove all of the other libraries that don't need to be there).

    Your issue is probably due to not knowing which JS files get inserted into the dom and when. We're looking at implementing a custom Client Dependency library (which is currently commited to the 4.1 branch) which will allow you to just tag your controls with client dependencies (js/css files) and Umbraco will take care of everything, ensuring there are no duplicates, etc...

    I'd use firebug or another proxy tool (i.e. Charles, Fiddler, etc...) to find out if you are getting duplicate javascript files being embedded in your DOM.

  • bob baty-barr 1180 posts 1294 karma points MVP
    Jun 30, 2009 @ 04:45
    bob baty-barr
    0

    hey, not sure if this is anything or not, but you do have an error in your css that might be breaking something....SubPageListPane
    {
    float:left;
    background-image: url("/Images/SubMenuBG.png");
    repeat-y;
    width: 199px;
    padding-left: 10px;
    }

    you should combine your background statement to look more like this...
    background: url(/Images/SubMenuBG.png) repeat-y;

    the line repeat-y; is not properly formed and may be breaking any css that comes below it.

    also, i remember having some issues with swfobject and lightbox, perhaps comment out swfobject and see if that fixes anything, then i think you can call swfobject after lightbox and still be okay.

    let me know if any of those help. also, for tabs, you could look into...
    http://stilbuero.de/jquery/tabs_3/



  • Fredrik Esseen 594 posts 830 karma points
    Jun 30, 2009 @ 08:06
    Fredrik Esseen
    0

    Hi and thank you!

    Since I posted this post I have changed stuff so it doesnt look at all as it did before :) I skipped the lightbox-solution and is now using a slideshow sollution as you can see.

    My biggest problem is my lack of skill in JS so Im testing back and forth with different solutions.
    Thank you all for the tips!

  • Fredrik Esseen 594 posts 830 karma points
    Jun 30, 2009 @ 08:36
    Fredrik Esseen
    0

    Now I've implemented the tabs suggested by ddrayne but then the slideshow craches.. Any suggestions..?
    http://web.u2754110.fsdata.se/produkter/as-domzale/rapido.aspx

  • dandrayne 1138 posts 2262 karma points
    Jun 30, 2009 @ 10:53
    dandrayne
    0

    I'm getting an error saying "p.getElementsByTagName is not a function" on your page, that I didnt get yesterday.  If possible, it may help to validate the html code just to be sure that the markup isn't causing any problems. 

    Another thing is that you only seem to be setting up the tabs on document ready - should the jquery slideshow not be in there as well?script</span>>

    // perform JavaScript after the document is scriptable.
    $(function() {
    // setup ul.tabs to work as tabs for each div directly under div.panes
    $("ul.tabs").tabs("div.panes > div");
    });
    </<span class="end-tag">script</span>>

  • Fredrik Esseen 594 posts 830 karma points
    Jun 30, 2009 @ 11:42
    Fredrik Esseen
    0

    When I put the jscode in $(function() I dont get any slideshow effect at all. Am I implementing the code in the wrong order?

  • dandrayne 1138 posts 2262 karma points
    Jun 30, 2009 @ 12:44
    dandrayne
    101

    I've never used that particular slideshow, so can't be certain of the config options before.  There does seem to be a bit of a mix of jquery and non-jquery code in there though.

    Tabs are looking good!  Hows about using a different (that's always my answer, sorry!) image gallery plugin?  A simple image fade (http://www.malsup.com/jquery/cycle/) might be decent, or any of the solutions from http://jquerylist.com/#photos_images_galleries.

    I've also written a very small image gallery jquery plugin which you could try, and I know it plays nice with tabs.  It expects a list of images, so it's fairly simple to implement with a just bit of css.  Let me know how you get on, and if you'd like me to package up the small image gallery demo.

  • Fredrik Esseen 594 posts 830 karma points
    Jun 30, 2009 @ 13:51
    Fredrik Esseen
    1

    Thank you for all your help ddrayne!
    im sticking with the current slideshow solution for now and tries to solve the tab solution in another way for the moment. I cant find an adequate slideshow with jquery for now and publish-time is coming closer :) Thank you for all your efforts!

  • dandrayne 1138 posts 2262 karma points
    Jun 30, 2009 @ 15:37
    dandrayne
    0

    Good luck! Post back if you can't find a decent slideshow, I'm sure one could be found somewhere.

     

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies