WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Rollover image (6 posts)

  1. Ricardo
    Member
    Posted 3 years ago #

    I want to add 3 rollover image's (logo's) vertically next to my right sidebar (On the background). But how do I make that work. I have the button's (normal and hover) on my file server, but all the tutorials I find are for HTML websites, and I only have PHP files.

    Can someone please help me out?

    My site http://www.fastforwardandrewind.com

  2. You can use the rollover tutorials you found. Even though your theme files have .php extensions, they are actually a mix of PHP and HTML code. You can still use HTML rollover code on them as you would on any HTML site.

  3. Ricardo
    Member
    Posted 3 years ago #

    I want the rollover image's on my background, In what file should I put the HTML code? Index.php?

  4. alchymyth
    The Sweeper & Moderator
    Posted 3 years ago #

    you probably need to start by adding the html code to header.php.

    (depending on your code)

    give them some unique css classes; and add the styles for the positions, sizes, and image hover into style.css of your theme.

  5. Ricardo
    Member
    Posted 3 years ago #

    Thanks! :-)

  6. Ricardo
    Member
    Posted 3 years ago #

    It worked locally with this code:
    In the header, under the body tag:
    <div id="twitter"></div><!

    In my child-theme stylesheet:

    #twitter {
    	background:url(http://www.fastforwardandrewind.com/buttons/twitter.png);
    	width:70px;
    	height:140px;
    }
    #twitter:hover {
    	background:url(http://www.fastforwardandrewind.com/buttons/twitter.png);
    	width:70px;
    	height:140px;
    	background-position:0 -70px;
    }

    But when I added it to the on-line version of my site, the entire lay out of the page went wrong. Can somebody please help me? I really want this to work. (The buttons needs to hover over my background, on the right side next to the sidebar)

Topic Closed

This topic has been closed to new replies.

About this Topic