javascript - onmouseover in CodeIgniter -
i have view displayed titles checkboxes. when put cursor on title want display me text box contains little description of title. try put in title $row['description']
doesn't ok. want configure box have displayed title $row['pubdate']
, $row['description']
. i've tried onmouseover
don't know how function. help?
<?php foreach ($query $row){ echo '<tr><td> <label class="checkbox"> .form_checkbox('delete[]', $row['link']).anchor("site/see_art/".$row['feed_id'],$row['title'],'title='.$row['title'].''). "</td><td>".substr($row['pub_date'], 5, 12). "</label> </td></tr>"; } ?>
put div
position:absolute
in label
, show on mouseover:
html:
<label class="checkbox"> <input type="checkbox" name="nom"/> checkbox 1 <div class="tooltip">title blablabla 1 <span class="postdate">date: 2014/03/24</span> </div> </label>
js:
var ele = document.queryselectorall(".checkbox"); for(var i=0; < ele.length; i++){ ele[i].addeventlistener("mouseover", function(event){ var x=event.clientx; var y=event.clienty; var tooltip = this.queryselector(".tooltip"); tooltip.style.display="block"; tooltip.style.top=y+"px"; tooltip.style.left=x+"px"; }); ele[i].addeventlistener("mouseout", function(el){ this.queryselector(".tooltip").style.display="none"; }); }
nb: not work ie8, ie8 not have queryselector
. easier jquery.
Comments
Post a Comment