Programming C, C++, Java, PHP, Ruby, Turing, VB
Computer Science Canada 
Programming C, C++, Java, PHP, Ruby, Turing, VB  

Username:   Password: 
 RegisterRegister   
 Transparent links for IE and FireFox?
Index -> Graphics and Design, Web Design -> (X)HTML Help
View previous topic Printable versionDownload TopicSubscribe to this topicPrivate MessagesRefresh page View next topic
Author Message
Justin_




PostPosted: Fri Aug 11, 2006 11:28 pm   Post subject: Transparent links for IE and FireFox?

Hello i have invisible links so as to make certain regions of images clickable. Here is my code to do this minux the css style which i simply used to position it.
HTML:


<div id="link"><a href="somelink.html"><span style="display: block;">&nbsp;</span></a></div>


This renders properly in Firefox but in IE the clickable region is pathetically small. Thanks for any help.
Sponsor
Sponsor
Sponsor
sponsor
rdrake




PostPosted: Sat Aug 12, 2006 12:46 am   Post subject: (No subject)

So... you're trying to create an image map of sorts?
Justin_




PostPosted: Sat Aug 12, 2006 1:24 am   Post subject: (No subject)

Exactly, but I forgot to mention I don't use that image map crap, instead I use CSS to map the image.
[Gandalf]




PostPosted: Sat Aug 12, 2006 1:58 am   Post subject: (No subject)

Umm... I don't do a lot of web developing, but that image map seems to work, while your method doesn't. It's also probably a lot simpler than whatever you're doing. Why complicate things unnecissarily?
Justin_




PostPosted: Sat Aug 12, 2006 10:22 am   Post subject: (No subject)

I can assure you using CSS to map an image is just as simple as using an image map. The CSS portion is working for both IE and Firefox I can tell because the link is positioned fine, now I just need to enlarge it in a way that both IE and FireFox will work.

No one ever done a site with CSS image maping before?
Amailer




PostPosted: Mon Aug 21, 2006 6:52 pm   Post subject: (No subject)

I'm not sure if this is Image Mapping, but I did do this with CSS:
HTML:
<a href="index.html"><span class="home_link">&nbsp;</span></a>



That is in a <div></div> which has the image as its background

css:
.home_link {
        float: right;
        display: block;
        clear: both;

        width: 410px;
        height: 35px;

        text-decoration: none;
}


Thats the um, css for that class. It works on IE,Firefox,Safari,Opera - any other browser I haven't tested it...yet -.-

Though, try it and tell me if it works for you Smile

EDIT1
Problem is, in IE6 at least, when you hover over the link it doesn't change into a hand (like it usually does over other links) insted it stays as a mouse pointer o.O hmm
cadoo




PostPosted: Mon Dec 18, 2006 3:39 pm   Post subject: (No subject)

code:
element {
        cursor: pointer;
        cursor: hand;
}


http://www.quirksmode.org/css/cursor.html
Display posts from previous:   
   Index -> Graphics and Design, Web Design -> (X)HTML Help
View previous topic Tell A FriendPrintable versionDownload TopicSubscribe to this topicPrivate MessagesRefresh page View next topic

Page 1 of 1  [ 7 Posts ]
Jump to:   


Style:  
Search: