You need two DIVs, an outer one that acts are the view "window", and
an inner that contains the image. The outer one has a style of
overflow:hidden, so your image, which is larger than the outside DIV
is partially invisible. For this example, the image would be 30px
high, by 60 px wide.
<div id='outer' onmouseout='showOther(0)'
onmouseover='showOther(-30)' style='position:relative;height:
30px;width:30px;overflow:hidden'><div id='inner'
style='position:absolute;top:0px;left:0px'><img src='sample.gif'></
div></div>
Then in your showOther function, reposition the inner DIV:
function showOther(pos) {
$('inner').style.left=pos+'px';
}
Good luck.
On Jan 15, 6:33 am, michal <[EMAIL PROTECTED]> wrote:
> i thought this might fit good in here .. i am wondering how to solve
> the following problem best with prototype and scriptaculous:
>
> i want to allow my visitors to mark items as their favorite by
> clicking on a star next to the items title .. when its marked then
> the star is turned yellow and when unmarked its white .... i have seen
> a lot of sites which use an image that contains both of those stars in
> one image ... whats the best approach to solve this with javascript ..
> should i put this image as background then?
>
> thx for help
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby
on Rails: Spinoffs" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
