Solved

how to link to another page using hover

Posted on 2009-05-18
9
323 Views
Last Modified: 2012-05-07
i have a row with 5 column.
i want my first column able to link to other page
i want to use hover so that whenever i point to first column an underline occur and the row change to another color.

0
Comment
Question by:tankergoblin
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
9 Comments
 
LVL 4

Expert Comment

by:darenceang
ID: 24410495
Not sure if this could help...

<body onMouseOver="location.href='http://www.yahoo.com/';"
bgcolor="#ffffff" text="#000000" link="#000000" vlink="#000000">

Open in new window

0
 
LVL 11

Accepted Solution

by:
BrianMM earned 500 total points
ID: 24410506
Hi,

This should do it.
<table width="100%" cellpadding="0" cellspacing="0">
	<tr style="cursor:pointer;width: 250px;" onclick="javascript:location='index.php?mod=batch&act=create'" onmouseover="style.backgroundColor='#A0A0A4';cursor: pointer; cursor: hand;" onmouseout="style.backgroundColor=''">
		<td>row 1 col 1</td>
		<td>row 1 col 2</td>
	</tr>
	<tr style="cursor:pointer;width: 250px;" onclick="javascript:location='index.php?mod=batch&act=create'" onmouseover="style.backgroundColor='#A0A0A4';cursor: pointer; cursor: hand;" onmouseout="style.backgroundColor=''">
		<td>row 2col 1</td>
		<td>row 2 col 2</td>
	</tr>
	<tr style="cursor:pointer;width: 250px;" onclick="javascript:location='index.php?mod=batch&act=create'" onmouseover="style.backgroundColor='#A0A0A4';cursor: pointer; cursor: hand;" onmouseout="style.backgroundColor=''">
		<td>row 3 col 1</td>
		<td>row 3 col 2</td>
	</tr>
</table>

Open in new window

0
 
LVL 11

Expert Comment

by:BrianMM
ID: 24410513
just remove the onlick, if you want the specific link aspect...
0
Optimize your web performance

What's in the eBook?
- Full list of reasons for poor performance
- Ultimate measures to speed things up
- Primary web monitoring types
- KPIs you should be monitoring in order to increase your ROI

 
LVL 5

Expert Comment

by:bored321
ID: 24410586
Think this is what you are after.
<table width="100%" cellpadding="0" cellspacing="0">
  <tr>
    <td style="cursor:pointer; width: 200px;" onclick="javascript:location='yourpage.htm'" onmouseover="style.backgroundColor='#eee'; style.textDecoration='underline'; cursor: pointer; cursor: hand;" onmouseout="style.backgroundColor=''; style.textDecoration='none';">row 1 col 1</td> <td>row 1 col 2</td> <td>row 1 col 3</td> <td>row 1 col 4</td> <td>row 1 col 5</td>
  </tr>
</table>

Open in new window

0
 
LVL 11

Expert Comment

by:BrianMM
ID: 24410705
That will only change the colour of the 1st cell, question states row to change colour.
0
 
LVL 7

Author Comment

by:tankergoblin
ID: 24417777
BrianMM:
Your idea looks good but i think is not efficient to declare cursor pointer in every row .
you know any jquery that can do this?
0
 
LVL 7

Author Comment

by:tankergoblin
ID: 24417779
BrianMM:
Your idea looks good but i think is not efficient to declare cursor pointer in every row .
you know any jquery that can do this?
0
 
LVL 11

Expert Comment

by:BrianMM
ID: 24419830
you can assign using a css class. My code was purley a rough guide to show the mechanism.
0
 
LVL 11

Expert Comment

by:BrianMM
ID: 24431969
Have been doing this for years... if you can explain & prove this it would be interesting.
0

Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

630 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question