Will Fix
Will Fix

Reputation: 105

In an HTML page I need to anchor to a tag on mouseover

<a href="#anchor1">
    <img src="http://www.test.com/images/test/test.png" width="80" height="150" />
</a>

<div id="anchor1">...</div>

When I mouse over test.png I need it to scroll the page to #anchor1 ..help_me

Upvotes: 0

Views: 3135

Answers (2)

FatherStorm
FatherStorm

Reputation: 7183

I'm not sure you're using "anchor" in the generally accepted sense. the tag is a "anchor" tag that is used to wrap around an image or text link, or now virtually any DOM object it consists of either a href tag, which is it's target, or a name tag in which case it IS a target. so a page with

<a id="part1"/><h3>part 1</h3></a>

and

<a href="#part1"><img src="..." onMouseover="$.scrollTo('#part1');"></a>

clicking on the image would make the page scroll so that the h3 containing "part1" would be at the top of the page.

to do it with jQuery and mouseOver you'll need to use jQuery scrollTo() then you can define your speed and easing.

Upvotes: 0

Evan Mulawski
Evan Mulawski

Reputation: 55334

Use Javascript inside the onmouseover event:

<img onmouseover="window.location.hash = 'anchor1'" />

Note that you don't use the '#' character.

Also, you are not naming the anchor correctly. It should be:

<a name="anchor1" .... instead of href.

Upvotes: 3

Related Questions