Grow your CSS skills. Land your dream job.

Problem with JavaScript mouse over element and text

  • # March 10, 2012 at 9:33 am

    Hello everyone!
    I’m new here and I have a problem with JavaScript, would be very grateful if someone here can help me.

    Basically i have found some code and modified it to suit my need,
    http://jsfiddle.net/tz9XG/6/
    i think on this website somewhere. It is working well as I need, It shows a rounded rectangle filled with black color when hovered over an image. But when hovering I want it to show some text inside the rectangle.

    Any one can help me, please?

    Thanks in advance.
    Aleks

    # March 10, 2012 at 9:38 am

    http://jsfiddle.net/tz9XG/7/

    The message displayed here is in the image tag
    also i centered text and set line-height to be the same as the height

    # March 10, 2012 at 9:41 am

    Sweet!
    Thank you so much!

    # March 10, 2012 at 12:02 pm

    Sorry, I got one more slight problem.
    I tried to insert this code into my website but it doesn’t work the same way it works on jsfiddle.net.

    I’m just confused with what goes where. I have the CSS code in my css style sheet- works ok.
    And javascript, I tried putting it in the HTML, head but no results, tried attaching to the html as a separate js file- still the same.

    Would be really grateful for any help.
    Thanks

    # March 10, 2012 at 12:12 pm

    I normally include CSS and JS libraries in the head section and the functions just before the end of the body, hope this helps

    # March 10, 2012 at 12:28 pm

    Thanks for the reply. I’m just not familiar with JS Libraries, where can i get them from?

    # March 10, 2012 at 1:01 pm

    jQuery is a library, can’t get link on my phone but google it and itll be the first thing you find, you need it for this to work

    # March 10, 2012 at 1:24 pm

    All sorted. Thanks for the help.

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".