Solved

click event doesnt work

Posted on 2013-05-17

1 solution

345 Views

Last Modified: 2013-05-22

Hi,

I cant click on my link that is in a div(2nd link). I need this to link to be in a div to swap an image.
How do I enable the click event like the 1st link does?

<a href="home.html"><img  src="images/ic1.png" alt=""/></a>

 
<div id="imgswap"> <a href="home.html"><img id="imgswap" src="images/ic1.png" alt=""/></a></div>  //click event doesnt work?

Open in new window

Comment

Question by:jagguy

[X]

Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

Help others & share knowledge
Earn cash & points
Learn & ask questions

Join The Community

5 Comments

LVL 53

Expert Comment

by:Scott Fell, EE MVE

ID: 391764152013-05-17

You should post your entire page because that code works as is

LVL 82

Expert Comment

by:leakim971

ID: 391764212013-05-17

work fine : http://jsfiddle.net/AdY6f/

Accepted Solution

by:jagguy

jagguy earned 0 total points

ID: 391764352013-05-17

OK I found better code to make it work.
I do put it in a list and just swap images over hover.

ul.nav
{
    list-style-type: none;
    padding: 0;
    margin: 0;
    float: left;
    
}

ul.nav a
{
    border: 0px solid #cccccc;
    display: block;
    height: 100px;
    padding-top: 72px;
    width: 100px;
    
}

.nav li#welcome a {
	 background-image:url(images/ic1.png); 
  background-repeat: no-repeat; 
	 
	 }
.nav li#welcome a:hover {
	 background-image:url(images/ic1b.png); 
  background-repeat: no-repeat; 
   }

.nav li#welcome2 a {
	 background-image:url(images/ic1.png); 
  background-repeat: no-repeat; 
	 
	 }
.nav li#welcome2 a:hover {
	 background-image:url(images/ic1b.png); 
  background-repeat: no-repeat; 
   }
 
 
   
#head{
	
}
	
</style>
</head>

<body>


<div id="head">
  <ul class="nav">
    <li id="welcome"><a href="home.html"></a></a></li>
    <li id="welcome2"><a href="home.html"></a></a></li>
  </ul>
</div>

Open in new window

LVL 9

Expert Comment

by:Sar1973

ID: 391768482013-05-18

Try to assign another ID to the div: they are identical.

Author Closing Comment

by:jagguy

ID: 391868952013-05-22

I found solution (last post)

Featured Post

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Email Signature Size - Best Practice

Article by: Exclaimer

Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.

Create a responsive confirmation popup using HTML, CSS, jQuery and Promises

Article by: Julian

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises

Corner Ribbon Effect in CSS

Video by: Sarah

In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon": Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …

HTML
CSS

Using Google Font API in CSS

Video by: Sarah

In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…