WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You

WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You


You are not connected. Please login or register

View previous topic View next topic Go down  Message [Page 1 of 1]

1Jquery animate the posting butons !  Empty Jquery animate the posting butons ! Wed Jun 15, 2011 3:18 pm

razvy3


Registered Member
Registered Member
I tried to animate up/down the posting buttons but no effect this is the code

css
Code:
 .posting img {
    background: url("http://i36.servimg.com/u/f36/11/96/49/61/onhove10.png") repeat scroll 0 0 transparent;
}

jquery
Code:
  $(function(){
$('.posting img')
.css( {backgroundPosition: "0 0"} )
.mouseover(function(){
$(this).stop().animate({backgroundPosition:"(0 44px)"}, {duration:200})
})
.mouseout(function(){
$(this).stop().animate({backgroundPosition:"(0 0)"}, {duration:200})
})
}); 

2Jquery animate the posting butons !  Empty Re: Jquery animate the posting butons ! Wed Jun 15, 2011 10:33 pm

Drogba921


Registered Member
Registered Member
What exactly are you trying to do?

http://www.codinghelp.org

razvy3


Registered Member
Registered Member
i want to do this effect http://snook.ca/technical/jquery-bg/ example A !

RockerMan

RockerMan
Technician
Technician
Code:
$(function(){
   $('.posting img')
      .css( {backgroundPosition: "0 0"} )
      .mouseover(function(){
         $(this).stop().animate({backgroundPosition:"(0 44px)"}, {duration:500})
      })
      .mouseout(function(){
         $(this).stop().animate({backgroundPosition:"(0 0)"}, {duration:200, complete:function(){
            $(this).css({backgroundPosition: "0 44px"})
         }})
      })

Try this Smile

http://www.graphics-post.com/

razvy3


Registered Member
Registered Member
i tried this is my css code
Code:
 .posting img {
    background: url("http://i36.servimg.com/u/f36/11/96/49/61/onhove10.png") repeat scroll 0 0 transparent;
}
.posting img:hover {
    background-position: 0px 44px;

 

and the jquery from you but is not that effect

RockerMan

RockerMan
Technician
Technician
You are hosting it correctly, yes?

Also, are you enclosing it in document.ready?

http://www.graphics-post.com/

Gangstar15

Gangstar15
Registered Member
Registered Member
Did you also hosted the background position plugin:
http://snook.ca/technical/jquery-bg/jquery.bgpos.js

RockerMan

RockerMan
Technician
Technician
Thats just for IE I think mate Smile

I tried it without and worked fine Wink

http://www.graphics-post.com/

razvy3


Registered Member
Registered Member
Solved!



Last edited by razvy3 on Thu Jun 16, 2011 4:58 pm; edited 1 time in total (Reason for editing : solved)

10Jquery animate the posting butons !  Empty Re: Jquery animate the posting butons ! Thu Jun 16, 2011 7:18 pm

RockerMan

RockerMan
Technician
Technician
Topic marked as Solved & Locked

~ RM

http://www.graphics-post.com/

Sponsored content


View previous topic View next topic Back to top  Message [Page 1 of 1]

Permissions in this forum:
You cannot reply to topics in this forum