Member Avatar for kaushik259106

Hi Everyone,
Can some one tell me is this possible. I want to show a text hiperlink over an image.

[IMG]http://img371.imageshack.us/img371/5936/texthiperlinkjv3.th.png[/IMG][IMG]http://img371.imageshack.us/images/thpix.gif[/IMG]

The image it self wont be hyperlink but only the text over it. Check this attached image. Need some thing like this..


Thanks,

  • 4 Contributors
  • 3 Replies
  • 117 Views
  • 2 Weeks Discussion Span
  • Latest Post Latest Post by essential
Member Avatar for SoniaBaby

You can create your link within a <div> and position it over the image using CSS


SoniaBaby

Member Avatar for Manuz 
same as Sonia said...
create a div tag..make its bg as ur image..then add ur href inside the div.tats all..
Member Avatar for essential

Javasript wont be necessary for this one. CSS wil do fine and here's the actual code and along with your image. Just dont forget to polish the styles according to your needs.

<html>
<head>
<title><!--Sample--></title>
<style type="text/css">
<!--
body {
    margin: 10px 0 0 0;
    padding: 0;
    text-align: center;
    background: Navy;
    
}

#wrapper {
    margin: 0px;
    padding 0px;
    width: 700px auto;
}
#header {
    background: Navy url(texthiperlinkjv3.png) no-repeat center top;
    height: 140px;
    width: 618px;
    padding: 70px 0px 0px 227px;
}
#header p a {
    font: bold 13px/70% Verdana, Arial;
    text-decoration: none;
    color: White;
    white-space: pre;
}
-->
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<p><a href="#">TEXT HyperLink Click This</a></p>
</div>
</div>
</body>
</html>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.