javascript - Issue with my CSS template when the mouse is over the tiles -
here's want : i've created 1 generic template feed several tiles. when mouse on tile, shows transparent-black square icon on tile. works fine, problem when got multiple tiles using template on same page, no matter tile mouse over, transprent-black square on first tile.
here's code, it's mixed css/javascript code (it works) i've tried create js function can't make work.
<div class="hover" style="width: 100%; height: 100%; overflow: auto;" onmouseover="document.getelementbyid('tag').style.display='';" onmouseout="document.getelementbyid('tag').style.display='none';"> <div style=" background-repeat: no-repeat; background-position: center; background-size:27px 27px; background-image:url('/static/img/icons/search.png'); background-color: black; width: 100%; height: 70%; opacity:0.7; position: absolute; z-index: 2; display: none; " id="tag"> </div> <!-- insert picture top of tile !--> <img src='<% if (typeof(image) != "undefined") { %><%= image %><% } %>' align=left; style="height:70%; padding-bottom: 0px; width:100%;"> <!-- add title--> <h2 class="ok" style="margin-left:20px; margin-top: 15px;"> <% if (typeof(title) != "undefined") { %><%= title %><% } %></h2> <!-- add description--> <h4 class="mt5" style="margin-left:20px; margin-top: 10px;"> <% if (typeof(description) != "undefined") { %><%= description %><% } %></h4> </div>
cheers, , advance asnwer :) vince
the problem assigning hover effect element id "tag". first item found affected.
try selecting each element separately.
Comments
Post a Comment