Hi, I think I have solved it but now an other question for you:
can I display by default the right part of the image?
THANKS
Sig
On May 4, 12:23 am, macsig <sigbac...@gmail.com> wrote:
> Hi guys,
> I have a couple of images with width = 280px and I would like to
> display, when the page is loaded, only a piece of them (the left
> 240px) and all the image once the mouse goes over the image.
>
> This is the html (for 1 image)
>
> <div class="badge" style="width: 240px; height:78px; overflow:
> hidden;"><img src="badge_1.gif" /></div>
>
> And here my script
>
> $(document).ready(function(){
> $('badge').hover(function() {
> $(this).animate({ width: "280px"});
> }, function() {
> $(this).animate({ width: "240px"});
> $(this).css({ "overflow", "hidden"});
> }
> );
>
> });
>
> I have added the last line because without it the div becomes 240px
> but right after that since the image is 280px it returns to 280px.
> But with that line I get :
>
> invalid object initializer: $(this).css({ "overflow", "hidden"});
>
> How can I get the effect I wish???
>
> Thanks and have a nice day!
>
> Sig
