Nreva10 Posted September 12, 2006 Share Posted September 12, 2006 Hi guys!I'm not quite sure where to post this topic because it involves HTML and CSS, so I decided to put it in this forum. Nevertheless that's not the point.I'm having trouble with a forum template. I wish to change the color of the text when I put my mouse over a section. I have managed to change the background and the links colour but, however, I cannot do so with plain text, this is, non-linked.You can see my problem here: IIND.sanmaikols.net The description of each forum should change from black to another colour when the mouse is on the red area, not only just over the text.The code is the following: <tr align="left" valign="top" class="pn-default" style="background-color:#EBEBEB;" onmouseover="this.style.background='#762929'; this.className='pn-plain';" onmouseout="this.style.background='#EBEBEB'; this.className='pn-default'"> <td headers="col_0" align="center" valign="middle" style="width:2%;"> <!--[ if $forum.new_posts eq 1 ]--> <!--[ pnimg src='red_folder.gif' alt='_PNFORUM_NEWPOSTS' altml=true ]--> <!--[ else ]--> <!--[ pnimg src='folder.gif' alt='_PNFORUM_NONEWPOSTS' altml=true ]--> <!--[ /if ]--> </td> <td headers="col_0"> <a title="<!--[ pnml name='_PNFORUM_GOTO_FORUM' ]--> '<!--[ $forum.forum_name ]-->'" href="<!--[ pnmodurl modname=pnForum type=user func=viewforum forum=$forum.forum_id ]-->"><strong><!--[ $forum.forum_name ]--></strong></a> <!--[ adminlink type=forum id=$forum.forum_id ]--> <br /><!--[ $forum.forum_desc ]--> <br /><!--[ pnml name='_PNFORUM_MODERATEDBY' ]-->: <!--[ listforummods moderators=$forum.forum_mods ]--> </td> <td headers="col_1" style="width:5%;text-align:center;" align="center" valign="middle"><!--[ $forum.forum_topics ]--></td> <td headers="col_2" style="width:5%;text-align:center;" align="center" valign="middle"><!--[ $forum.forum_posts ]--></td> <td headers="col_3" style="width:15%;text-align:center;" align="center" valign="middle"><!--[ if $forum.last_post_data.name <> '' ]--><!--[ $forum.last_post_data.unixtime|pndate_format:datetimebrief ]--><br /> <!--[ pnml name='_BY' ]--> <!--[ $forum.last_post_data.name|profilelink ]--><br /><a href="<!--[ $forum.last_post_data.url_anchor|pnvarprepfordisplay ]-->" title="<!--[ pnml name='_PNFORUM_GOTO_LATEST' ]--> '<!--[ $forum.last_post_data.subject|pnvarprephtmldisplay ]-->'"><!--[ pnimg src=icon_latest_topic.gif ]--></a><!--[ else ]--><!--[ pnml name='_PNFORUM_NOPOSTS' ]--><!--[ /if ]--></td> </tr> Thank you very much for your help! Link to comment Share on other sites More sharing options...
holmedwa04 Posted September 12, 2006 Share Posted September 12, 2006 Right the way I understand it is that you would like normal text to change colour when you hover over it?So just add this code to your site: <style>a.2:link { color:#??????; }</style> Then text that you want to change that colour will if you put them in this code: <a class="2" href="mypage.html">Your text</a> Just make sure that the text links to the same page, and then the words will change colour when you hover over them, but if someone clicks them it will just reload the page. Link to comment Share on other sites More sharing options...
Nreva10 Posted September 12, 2006 Author Share Posted September 12, 2006 Thanks. I had already done that another way and it also worked. The problem is that I would like to get rid of the bold text type.And just in case, is there any way to do this without putting a link to the same page? That would be great. Link to comment Share on other sites More sharing options...
holmedwa04 Posted September 12, 2006 Share Posted September 12, 2006 Erm, im really not sure, and yes, to be honest my way is very crude, I know eve myself. But why do you want normal text to change colour when you hover over it anyway? Link to comment Share on other sites More sharing options...
aspnetguy Posted September 12, 2006 Share Posted September 12, 2006 use javascript (IE only recognizes :hover on links) <span onmouseover="this.style.color='red'" onmouseout="this.style.color='black'">text to change</span> Link to comment Share on other sites More sharing options...
Nreva10 Posted September 12, 2006 Author Share Posted September 12, 2006 That's much better but still not the bull's eye. The idea to change the color is because black cannot be easily read in a red background. Consequently, I wish to change the color not when the mouse is on the text but on the row.You can see the improvements in the link above.Thanks again! Link to comment Share on other sites More sharing options...
holmedwa04 Posted September 12, 2006 Share Posted September 12, 2006 The trouble is that it does not open for me? Link to comment Share on other sites More sharing options...
Nreva10 Posted September 12, 2006 Author Share Posted September 12, 2006 I have managed to reduce the problem to this: <tr align="left" valign="top" style="background-color:#EBEBEB;" onmouseover="this.style.background='#762929'; this.style.color='#FEB300'; this.className='pn-plain';" onmouseout="this.style.background='#EBEBEB'; this.style.color='black'; this.className='pn-default'"> What's wrong with this code? The only attribute that does not work is the this.class.color. Why??If I put the tag in the <td> it works but only in the cell not in the whole row. Link to comment Share on other sites More sharing options...
justsomeguy Posted September 12, 2006 Share Posted September 12, 2006 This is just a guess, but it might be because you set the class after the style. If the class includes a color also, then setting the class after you set the color would change the color to whatever it is in the class. Link to comment Share on other sites More sharing options...
Nreva10 Posted September 12, 2006 Author Share Posted September 12, 2006 I have changed the order and, unfortunately, there is no difference. Thanks for the guess anyway. Link to comment Share on other sites More sharing options...
justsomeguy Posted September 12, 2006 Share Posted September 12, 2006 Does the background color change? Link to comment Share on other sites More sharing options...
Nreva10 Posted September 12, 2006 Author Share Posted September 12, 2006 Yes it does. Both the background and the style work perfectly.I have been doing a bit of research and I have found out that instead of headers you can use scope. Could that be of any help? It's because I find it pretty strange that the statement works everywhere but where it should.If you need a version of the code you can find it in the first message of this post. However I can upload a more actual one (I've done just a few changes). Link to comment Share on other sites More sharing options...
justsomeguy Posted September 12, 2006 Share Posted September 12, 2006 Actually, check that the tr does in fact use the color attribute. Background color makes sense for a table row, but a table row itself doesn't contain any text, so color might not necessarily apply to it. But you would still think it would pass the color on to its children. Try just applying a color directly to the tr and see if it even uses it:<tr align="left" valign="top" style="color: #00FF00; background-color:#EBEBEB;" onmouseover=... Link to comment Share on other sites More sharing options...
Nreva10 Posted September 13, 2006 Author Share Posted September 13, 2006 No change at all. It seems as it does not recognise the statement. Maybe the solution would be changing the CSS style sheet? I say that because the className works. Link to comment Share on other sites More sharing options...
justsomeguy Posted September 14, 2006 Share Posted September 14, 2006 If you can put a color in the class name and have that work, then do that. But you may not be able to apply a color to a tr. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now