-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Hi,
I'm still using ZK 3.6, and I'd like to create a normal (!) anchor link on a page. Here's what I have for this:
<toolbarbutton label="Sign in" onClick="auth.onSignIn(self)"></toolbarbutton>
It gets displayed in blue and statically underlined. Underline should be consistent with the browser setting ideally. But as a starting point it would be enough if I could get the "underline only when hover" effect, as this is the most commonly used. Can someone show me the magic to achieve this?
TIA
Zed
Have you tried the html comps?
<?xml version="1.0" encoding="UTF-8" ?> <zk xmlns="http://www.zkoss.org/2005/zul" xmlns:h="http://www.w3.org/1999/xhtml" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.zkoss.org/2005/zul http://www.zkoss.org/2005/zul/zul.xsd"> <window id="windowLinkTest" title="Html - Link test" border="normal" height="300px" width="500px" style="padding: 10px"> <separator /> <h:a href="http://www.zkoss.org/">ZK framework</h:a> <h:br /> <h:a href="http://www.forsthaus.de/blog/">Stephan's zk Blog</h:a> <h:br /> <h:a href="http://www.postgres.org">PostgreSQL</h:a> <h:br /> </window> </zk>
best
Stephan
Hi Stephan,
thanks for the reply! No, not yet. I'll try them now. Hm, I'd like to use them pretty much like the example, to trigger events in my app. So href would not really be used, but the onclick. Ok, I go and try it, and tell about the results :)
Cheers,
Z
Unfortunately, it does not work.
Test #1
<h:a href="#" onClick="auth.onSignIn(self)">Sign in</h:a> <h:br />
Result: Link with no hover effect (text is underlined), the link does nothing
Test #1
<h:a href="javascript:auth.onSignIn(self)">Sign in</h:a> <h:br />
Same as above.
Cheers,
Z
Hi,
thanks, I had a look and it does not work :) Results:
1. In Firefox I have a green link, statically underscored which does not change color either when hovering
2. In IE the color is chaning
3. I can't believe that displaying an anchor in a webframework should be a problem :) Is it solved in the 5.x versions?
Cheers,
Zed
I just tried this code with our live demo and it works. please try it and let me know.
<zk xmlns:h="http://www.w3.org/1999/xhtml" xmlns:zk="http://www.zkoss.org/2005/zk"> <style> a:link{ color:blue; } a:visited { color:green; } a:hover { color: green; } a:active { color:red; } a:selected{ color:red; } </style> <h:a href="http://www.zkoss.org/">ZKOSS</h:a> </zk>
Same problem. Actually I do not see why the example code would underscore the link text? I only see that certain colours are defined. Once again, is it really this hard to create a *normal* link (one that looks and behaves the same as on a plain old html in your browser :))?
cheers,
Zedkey
Hi zedkey,
Default behavior of html anchors are to statically display the underline. You need to disable it by using css text-decoration: none
<zk xmlns:h="http://www.w3.org/1999/xhtml" xmlns:zk="http://www.zkoss.org/2005/zk"> <style> a:link{ color:blue; text-decoration: none; } a:visited { color:green; } a:hover { color: green; text-decoration: underline; } a:active { color:red; } a:selected{ color:red; } </style> <h:a href="http://www.zkoss.org/">ZKOSS</h:a> </zk>
Asked: 2010-11-02 02:25:41 +0800
Seen: 1,012 times
Last updated: Nov 12 '10