1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Rep Power

    How to place isotope items in a scrollable div and retain jquery hover state effect?


    i am trying to implement three features:

    1. a scrollable div containing image thumbnails
    2. that can be sorted by jquery isotope
    3. that when hovered over display a div on top of other elements and beyond immediate containers.

    at the moment i can get either one or the other happening ie either the scrollbars show but then the hover state div is behind other elements, or i can get the hover state div in front of other elements but then the scrollbar does not display.

    (i have a jsfiddle but cannot post the link here because i am a new member, i hope it it not against the rules to post the link below in a different format so that i can show what is currently working - jsfiddle with /rwone/PUKjy/ appended).

    thank you.
  2. #2
  3. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    USA (verifiably)
    Rep Power
    Welcome to DevShed Forums, rwone.

    I see you got the below responses on Experts Exchange. Answer shopping doesn't change the facts of the problem, so don't get your hopes up too much about finding an answer you like more. Have you read the one reply you got on the jQuery.com Forums?
    Originally Posted by ChrisStanyon
    Not entirely sure you're going to be able to make that work. It seems that isotope is adding position:absolute to the DIV that contains your IMG and hidden DIV, so as soon as you try and position the hidden DIV, it's always going to be relative to that.

    I've never used isotope before but from a quick glance it looks like it's all about layout, so I doubt you can disable it's layout methods.

    Maybe you need to re-think your approach and either bin isotope or find a different way of showing the hidden information.
    Originally Posted by COBOLdinosaur
    "bin isotope"
    That is the best solution. The way it is written it is just going to keep causing problems with the other components on the page. Changing things around probably just results in it screwing things up in a different way.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).

IMN logo majestic logo threadwatch logo seochat tools logo