alex alex - 2 years ago 105
HTML Question

Pass to javascript function div class arguments

I'm working on some website. I have a question. How to give class name to JS function.
Here is my code:

<div class="grid-item">
<div id="info">
<div class="glyphicon glyphicon-search" style="hidden: hidden;">
<img onmouseover="show(this)" onmouseout="hide(this)" src="'smiley.gif'" />

My JS function look like this

function show(x) { visible;

function hide(x) { hidden;

But in onmouseover and onmouseout i do not want to use this. I what to show or hide

<div class="glyphicon glyphicon-search" style="hidden: hidden;"></div>

from html. How to do this?
My idea is to give to this div id and then that id to pass to function, but how to do this.

Remeber that i will have a lot of div tags (), for every picture.

And also how to position that div on right top corner of image?


Answer Source

If you are using jQuery, then use this.

function show(x) {
function hide(x) {

But it is preferred to do something like this. Add a class to these images smiley.

<img class="smiley" src="'smiley.gif'" />


$('img.smiley').on('hover', show, hide);

function show() {
function hide() {

or using the mouseover / mouseout events and event delegation,

    .on('mouseover', 'img.smiley', show)
    .on('mouseover', 'img.smiley', hide);
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download