javascript - How can I add a style to a child div when hovering the parent? -
javascript - How can I add a style to a child div when hovering the parent? -
i have table of venue records , each venue has map icon absolutely positioned on page (using top , left integer fields each record).
each venue displayed on index page partial each venues icon plopped on map displayed away main partial. (all partials shown in grid style on 1 side of screen , map icons shown on png map on other side of screen.)
venue partial
<%= link_to venue %> <div class="venue_partial"> <div class="venue_icon"> <%= image_tag venue.venuetype.icon.url(:thumb), :class => 'image' %> </div> <span class="venue_partial_name"><%= venue.name %></span> <div id="venue_map_icon_<%= venue.id %>" style="position:absolute;" class="mapicon"> <%= image_tag (venue.venuetype.mapicon.mapicon.url(:mapicon)) %></div> </div> <% end %> <script type="text/javascript"> document.getelementbyid("venue_map_icon_<%= venue.id %>").style.left= "<%= venue.iconleftpx %>px"; document.getelementbyid("venue_map_icon_<%= venue.id %>").style.top= "<%= venue.icontoppx %>px"; </script> the venue partial has hover style changes background colour. when hover on venues map icon, background colour of main partial changes expected.
however, how can go making map icon alter style when hovering on main partial?
each map icon has .mapclass:hover style activated when hovering on icon not partial sitting in.
thanks help much appreciated!
css:
.parent:hover .child { /* kid style */ } javascript ruby-on-rails css hover
Comments
Post a Comment