Logo Sliding Hitskin_logo Hitskin.com

This is a Hitskin.com skin preview
Install the skinReturn to the skin page

The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.
+2
SLGray
Raze
6 posters

    Logo Sliding

    Raze
    Raze
    Forumember


    Male Posts : 406
    Reputation : 12
    Language : English, HTML, CSS

    Solved Logo Sliding

    Post by Raze Sat 5 Nov - 2:18

    As of here > http://demo.nicetheme.com/forum?theme_id=179315
    If you put mouse on logo it slides to the right.
    How could I get that :o
    SLGray
    SLGray
    Administrator
    Administrator


    Male Posts : 51500
    Reputation : 3523
    Language : English
    Location : United States

    Solved Re: Logo Sliding

    Post by SLGray Sat 5 Nov - 3:56

    When I visited the skin, the logo did not move.



    Logo Sliding Slgray10

    When your topic has been solved, ensure you mark the topic solved.
    Never post your email in public.
    Raze
    Raze
    Forumember


    Male Posts : 406
    Reputation : 12
    Language : English, HTML, CSS

    Solved Re: Logo Sliding

    Post by Raze Sat 5 Nov - 4:05

    Did you put your mouse on the logo?
    or it might not move for internet explorer
    SLGray
    SLGray
    Administrator
    Administrator


    Male Posts : 51500
    Reputation : 3523
    Language : English
    Location : United States

    Solved Re: Logo Sliding

    Post by SLGray Sat 5 Nov - 4:07

    It did move when I used Opera, but did not when I used Internet Explorer.



    Logo Sliding Slgray10

    When your topic has been solved, ensure you mark the topic solved.
    Never post your email in public.
    Raze
    Raze
    Forumember


    Male Posts : 406
    Reputation : 12
    Language : English, HTML, CSS

    Solved Re: Logo Sliding

    Post by Raze Sat 5 Nov - 4:08

    Well yea
    I want to get my logo to move like that.
    But I can't figure out the right code
    maijiyeon
    maijiyeon
    Forumember


    Female Posts : 145
    Reputation : 3
    Language : Ipoh
    Location : T-ara KPOP

    Solved Re: Logo Sliding

    Post by maijiyeon Sat 5 Nov - 4:40

    the logo moved.. well..u need codes for it..
    LGforum
    LGforum
    Hyperactive


    Male Posts : 2265
    Reputation : 264
    Language : English
    Location : UK

    Solved Re: Logo Sliding

    Post by LGforum Sat 5 Nov - 4:42

    Look into jQuery animate() function. Wink

    Code:

    $(logo id).mouseover(function() {
     $(this).animate() {
     the stuff you want it to do
     }
    });
    avatar
    robot_boy18
    Forumember


    Male Posts : 107
    Reputation : 7
    Language : English
    Location : Greenville, South Carolina, USA

    Solved Re: Logo Sliding

    Post by robot_boy18 Sat 5 Nov - 4:49

    lol it's css not script bwi
    LGforum
    LGforum
    Hyperactive


    Male Posts : 2265
    Reputation : 264
    Language : English
    Location : UK

    Solved Re: Logo Sliding

    Post by LGforum Sat 5 Nov - 5:08

    I'd love to see you do that with CSS...

    CSS can move things on mouseOver, but it can't animate things.
    avatar
    Guest
    Guest


    Solved Re: Logo Sliding

    Post by Guest Sat 5 Nov - 5:46

    http://w3schools.com/cssref/css3_pr_transition.asp

    That's how the logo hover was done on that theme.
    avatar
    robot_boy18
    Forumember


    Male Posts : 107
    Reputation : 7
    Language : English
    Location : Greenville, South Carolina, USA

    Solved Re: Logo Sliding

    Post by robot_boy18 Sat 5 Nov - 5:47

    It can, take a look at my example:
    Code:
    #logo {
        -moz-transition-duration: 1s;
        -moz-transition-property: -moz-transform;
        background-position: left center;
        background-repeat: no-repeat;
        height: 100px;
        position: relative;
        text-align: left;
        top: 15px;
    }
    #logo:hover {
        -moz-transform: translate(60px);
    }
    LGforum
    LGforum
    Hyperactive


    Male Posts : 2265
    Reputation : 264
    Language : English
    Location : UK

    Solved Re: Logo Sliding

    Post by LGforum Sat 5 Nov - 10:26

    Razz I take it back! I do apologise.

    man i need to look into more CSS3. I'm living in the past.
    avatar
    Guest
    Guest


    Solved Re: Logo Sliding

    Post by Guest Sat 5 Nov - 10:38

    Code:

    #logo, #i_logo {
        -moz-transition-duration: 1s;
        -moz-transition-property: -moz-transform;}
    #logo, .#i_logo:hover {
        -moz-transform: translate(60px);
    }
    Raze
    Raze
    Forumember


    Male Posts : 406
    Reputation : 12
    Language : English, HTML, CSS

    Solved Re: Logo Sliding

    Post by Raze Sun 6 Nov - 6:23

    The codes didn't make my logo slide Sad
    avatar
    Guest
    Guest


    Solved Re: Logo Sliding

    Post by Guest Sun 6 Nov - 11:23

    Here you go:

    Code:

    #pun-logo {
        -moz-transition-duration: 1s;
        -moz-transition-property: -moz-transform;}
    #pun-logo:hover {
        -moz-transform: translate(60px);
    }
    Raze
    Raze
    Forumember


    Male Posts : 406
    Reputation : 12
    Language : English, HTML, CSS

    Solved Re: Logo Sliding

    Post by Raze Sun 6 Nov - 14:39

    Thanks Johnny it worked.
    Nera.
    Nera.
    Energetic


    Female Posts : 7078
    Reputation : 2017
    Language : English
    Location : -

    Solved Re: Logo Sliding

    Post by Nera. Sun 6 Nov - 14:40

    Topic solved