The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Programming Fundamentals" Dec 02 - 2:00 PM Eastern

how to assign different behavior to parent and child elements when child is hovering on top of paren

  • # December 17, 2012 at 3:23 am

    Long story short

    Please see the demo [here]( “reduced test size”).

    I have several `div.story-in-myworks`

    inside each `div.story-in-myworks`, there is a `div.pageimage-div-overlay` that controls the overlay over each `div.story-in-myworks`.

    Inside each `div.pageimage-div-overlay` there is a `a.btn-storysetting` responsible for hiding and showing a `div.storysettings_talkbubble_left`.

    both `a.btn-storysetting` and `div.storysettings_talkbubble_left` are child elements of `div.pageimage-div-overlay`.

    Here is a snippet:

    # December 18, 2012 at 1:27 am

    this is the code i used :

    /* tooltip for the settings */
    // when enter into a story

    var currentStory = $(this);
    // and then click on the setting button of this story
    var settingBtn = $(this).find(“.btn-storysetting”);

    var container = $(this).find(“.pageimage-div-overlay”); {

    var settingBubble = $(this).next(“div.settings-bubble”);;





    var newCurrentStory = $(“.selected-story”);

    }); {

    if ($(‘btn-storysetting’)) {

    // put your separate behavior for the parent element.

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed