Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Other Need html code for fading an image on mouse hover

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #39249

    Hello, I hope I have come to the right place. I am currently trying to set up my own website and I need a HTML code written for image fade in as well as another code for image fade out. I don’t have Dreamweaver or JQuery and I have been searching everywhere for a code that I can use.

    My image code is: Photobucket

    Can someone help me out with a html code to make this scribble fade only once from 0% to 100% on mouse hover and then write another code to have this image fade only once from 50% to 100%. I have a few other images that I want to fade only once from 50% to 100% on mouse hover, but if the image code text can be highlighted in red so I know that I just need to change that part, that would be greatly appreciated!

    Any help will be greatly appreciated. Thanks! :)

    #107469

    Is this what you are after? http://jsfiddle.net/joshnh/dZFMW/

    #107470

    Josh that is perfect! I’d also love the html code in reverse, so from green to white. Thanks so much! :D

    #107471

    Is this the correct html code to have the image go from 0% to 100%?:

    {
    opacity: 0; /
    -webkit-transition: 1s;
    -moz-transition: 1s;
    -ms-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
    }
    img:hover {
    opacity: 1;
    }

    And is this the correct code to make the image go from 70% to 100%?:

    {
    opacity: .7; /
    -webkit-transition: 1s;
    -moz-transition: 1s;
    -ms-transition: 1s;
    -o-transition: 1s;
    transition: 1s;
    }
    img:hover {
    opacity: 1;
    }

    As it hasn’t really worked… Do I need to position the {…} code within the <...> code?

    Once again thanks for your help.

    #107481

    The web site that I am using to set up my website is http://www.moonfruit.com they only have the option for html snippets. It would be great if I could do this using a html code… Any help to create a html code would be very much appreciated. Thanks!

    #107484
    Paulie_D
    Member

    You can’t do transitions using html, you have to have access to the css files. If moonfruit won’t let you then I’m afraid you are out of luck.

Viewing 6 posts - 1 through 6 (of 6 total)
  • The forum ‘Other’ is closed to new topics and replies.