Features / Usability

Posted by sylvie greverend 07 Dec 2004 11:44 GMT-0000 posts: 1092

I didn't test on your style, but
Did you put the hover declaration in the right order
link, visited, hover active

Posted by Arnaud HERVE 08 Dec 2004 09:31 GMT-0000 posts: 179

Thank you for your help, Sylvie. In the php template I have copied the article id link of Read more around the Article header display command, and I have renamed the Div articleheaderlink instead of articleheadertext. In that way div articleheadertext layout now applies only to the header in the full article page, where there has to be no link on the header text.

The result is this (the tags didn't appear in tiki Code tag, so I removed them):

a href="tiki-read_article.php?articleId={$listpages[ix].articleId}"

div class="articleheadinglink"

{$listpages[ix].parsed_heading}

/div
 /a

I am explaining all that again because I have a hunch this tweak should be implemented by default. It is so very convenient to be able to click on the article header in order to read the full article. Maybe the Read more link is not enough.

Now, as far as the behaviour of the new articleheaderlink div is concerned, I wrote that below in the style sheet. The only important part is to have a simple text display, without ugly blue link or underline, and to have some sort of reaction when onmouseover. Here I chose the gray background that I already have on internal links:

.articleheadinglink {
	font-family:    Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size:   12px;
	display: inline;
	color: black;
	text-decoration: none;
}

.articleheadinglink:active {
	color:	black;
	text-decoration: none;
}

.articleheadinglink:hover {
	color:	black;
	text-decoration:   none;
	background-color: #EEEEEE;
}

.articleheadinglink:visited {
	color:	black;
	text-decoration: none;
}

But in fact only the first paragraph is implemented by the browser. You can see it applie becaust the text-decoration: none; in the paragraph applies. Not bad yet, because it avoids the html link blue display. If I remove the first paragraph, the display turns back to html blue underlined.

However I would like the hover background change to apply, and also I would like to understand why it doesn't apply.

Posted by sylvie greverend 08 Dec 2004 12:05 GMT-0000 posts: 1092

hover ... applied to a not a class
better to do in the css file
.articleheadinglink a {...}
.articleheadinglink a:active {...}
.articleheadinglink a:hover{...}
.articleheadinglink a:visited {...}

and in the tpl
div class="articleheadinglink"
a href=""
xxxxx
/a
/div

:-(: the wiki syntax is really buggy