/    Sign up×
Community /Pin to ProfileBookmark

Links Not Working in Table with Alpha Filter Background

To clarify, I made a table navigation bar in one frame of a site (each link is in a separate table row). I made the background of the table a translucent image with the IE alpha filter, and for some reason the links will not activate now (when moused over, there is no cursor change and clicking on them does nothing). The links themselves are plain text, and when I changa a{} properties in the head of the page, text-decoration and font weight/style are displayed appropriately. This would suggest that the links are being recognized and would work, but yet they don’t (in addition, a{hover:} commands don’t function either).

I’m using what I believe to be regular linking code in the table
<tr…><td…><a href=http://www.site.com target=frame2>Click Here</a></td></tr> ,
but none of them do a thing. Am I missing some big careless mistake here, or does the alpha filter have something to do with this problem?

to post a comment
CSS

9 Comments(s)

Copy linkTweet thisAlerts:
@toicontienFeb 26.2004 — You'll have to either post your entire code, HTML and CSS, or give us a link to the code before we can make that decision.
Copy linkTweet thisAlerts:
@TheHappyDrinkauthorFeb 26.2004 — Here's the code (minus the forced ad insertion crap from Angelfire, where I'm testing the site...):

<html>

<head>

<style type="text/css">

a:hover{color:#ccddee}

a:link{font-weight:normal; color:#ffffff; text-decoration:none; font-family:ms reference serif; font-size:17; font-style:oblique}

a:visited {font-weight:bold; color:#eebb88}

a{text-decoration:none}

table.alpha {filter: progid?XImageTransform.Microsoft.AlphaImageLoader(src=http://www.angelfire.com/ma4/thehappydrink3/images/navbaralpha.png, sizingMethod=scale)}

</style>

</head>

<body background=http://www.angelfire.com/ma4/thehappydrink3/images/backgroundnavbar.jpg bgproperties=fixed link=#ffffff alink=#ffffff>

<basefont color=#ffffff face=fine hand>

<table class=alpha height=500 width=120 cellspacing=1 cellpadding=1 style="border:2px outset #99bbff" align=center>

<tr height=70 align=center><td align=center>

<a href=http://www.angelfire.com/ma4/thehappydrink3/home.html target=frame2>

Home

</a></td></tr>

<tr height=70 align=center><td align=center>

<a href=http://www.angelfire.com/ma4/thehappydrink3/staff.html target=frame2>

Staff

</a>

</td></tr>

<tr height=70 align=center><td align=center>

<a href=http://www.angelfire.com/ma4/thehappydrink3/procedures.html target=frame2>

Procedures

</a>

</td></tr>

This link series repeats a few more times, and then that's the end of the table and the page. BTW, frame2 just refers to the main part of the page (the navbar's the left frame, frame1). I'm sure there are random mistakes or better ways to go about things here, but all I'm interested in is the reason for my links not working.

Edit: I see that some commands produce smilies on this board... well I'm too tired to get rid of them right now so just know that one is for Oblique text and the other is for the alpha filter.
Copy linkTweet thisAlerts:
@Robert_WellockFeb 26.2004 — The links work perfectly for me and change colour with M$ Explorer from the sample code though on your live website they don't thus concluding there must be an error in your syntax being introduced.
Copy linkTweet thisAlerts:
@TheHappyDrinkauthorFeb 27.2004 — Thanks but I'm not quite sure what you mean...what error is there if the code was copied exactly from my live site? I guess I could try accessing it from some other browser or loading it onto a different server than Angelfire but I don't see what difference it would make.
Copy linkTweet thisAlerts:
@TheHappyDrinkauthorMar 09.2004 — Bumping, because I still can't figure this out... I'd think that giving the table a class signature with the alpha filter as its only property may be the cause of the problem, but I don't know what else to add in there to get the links to activate.
Copy linkTweet thisAlerts:
@eliZZZaFeb 09.2005 — I encounter the same (to me) mysterious problem:

http://www.womenZZZ.net/

this is the prototype for my relaunch.

In the box to the left (with PNG background) the last link (mailto? IS working, not the test-links before. In the box "books" to the right the link does not work.

It appears to me, the links work, as long as they are below any other divs with PNG backgrounds. But I am not sure. I shortened the "topics" box, but the test-links still don´t work...

I forgot: I am talking about an IE 6.0 problem (as far I can test).

The stylesheet URL:

http://www.womenZZZ.net/scripts/styles_retro.css

(There are others just for design reason/colors, no other difference).

Grateful for any hint!

eliZZZa
Copy linkTweet thisAlerts:
@eliZZZaFeb 10.2005 — ...how easy the solution was (don´t laugh, if you already know it):

Make the PNG backgrounds (I use a single color with transparency) 1x1 pixel. Works.

Kind regards

eliZZZa
Copy linkTweet thisAlerts:
@mikepurvisFeb 10.2005 — [i]Originally posted by eliZZZa [/i]

[B]I encounter the same (to me) mysterious problem:

http://www.womenZZZ.net/

this is the prototype for my relaunch.[/B]
[/QUOTE]


Wow, spiffy site!

Breaks in ie5, but if your audience doesn't use that, it's very nice in ie6 and FF.
Copy linkTweet thisAlerts:
@eliZZZaFeb 11.2005 — Thank you Michael,

well, browsers beyond MS IE 6.x (various) make up less than 4% of my visitors. So, I live with it (and I hope my visitors can >;o)

Kind regards from Austria!

eliZZZa

P.S.: Does anybody here have an idea what´s the crux with the 1x1 pixel background links working and not working with different size backgrounds???
×

Success!

Help @TheHappyDrink spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.5,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...