SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Mar 2012
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing image credit to "on hover"

    Hi all,

    Take a look http://www.cookingexchange.info/

    Is there a way to at least make the image header link invisible unless you "mouse over" it?

    The image changes but an example link that I want to alter is
    Image credit: tonobalaguer / 123RF Stock Photo

    Thanks

  2. #2
    SitePoint Addict bronze trophy
    Join Date
    Mar 2013
    Location
    Oneonta, NY
    Posts
    307
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Bladefist,
    If you want to show credit when someone mouses over the image, you could just wrap the image in an <a> tag that has no destination and then put the credit in the title of the a tag.

    So it would look like this

    <a href=”#” title=” tonobalaguer / 123RF Stock Photo”><img src=”your/image.jpg” alt=”” /></a>

    Hope that helps,

    Shawn

  3. #3
    SitePoint Member
    Join Date
    Mar 2012
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by smanaher View Post
    Bladefist,
    If you want to show credit when someone mouses over the image, you could just wrap the image in an <a> tag that has no destination and then put the credit in the title of the a tag.

    So it would look like this

    <a href=”#” title=” tonobalaguer / 123RF Stock Photo”><img src=”your/image.jpg” alt=”” /></a>

    Hope that helps,

    Shawn
    Thanks Shawn for the quick response. I should have included more details. Here's a sample of what I'm working with (it may not be syntactically correct).

    <div id="slider" class="nivoSlider">


    <img src='http://www.cookingexchange.info/wp-content/uploads/2013/03/8384725_xl-resized.jpg' alt='' title='#sliderCaption1' />

    </div>
    <div id="sliderCaption1" class="nivo-html-caption">

    <p>Image credit: <a href="http://www.123rf.com/photo_8384725_blue-silver-kitchen-modern-architecture-decoration-interior-design.html">tonobalaguer / 123RF Stock Photo</a></p>
    </div>

    It's the image credit link above (it shows up as the red link under every slider image) that I want invisible unless someone "mouses over" it. Is this possible? Thanks again.

  4. #4
    Non-Member
    Join Date
    May 2013
    Posts
    0
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    you can follow this <a href=”#” title=” tonobalaguer / 123RF Stock Photo”><img src=”your/image.jpg” alt=”” /></a>

  5. #5
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,809
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by mdsujaan View Post
    you can follow this <a href=”#” title=” tonobalaguer / 123RF Stock Photo”><img src=”your/image.jpg” alt=”” /></a>
    Get rid of the unnecessary <a> tag. Just put the title on the img tag itself - title is valid on most tags that go in the body, you don't need to add extra tags to use it.

    Code:
    <img src=”your/image.jpg” title=” tonobalaguer / 123RF Stock Photo” alt=””/>
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  6. #6
    SitePoint Member
    Join Date
    Mar 2012
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    Get rid of the unnecessary <a> tag. Just put the title on the img tag itself - title is valid on most tags that go in the body, you don't need to add extra tags to use it.

    Code:
    <img src=”your/image.jpg” title=” tonobalaguer / 123RF Stock Photo” alt=””/>
    Thanks. One more question. What file do I have to edit for this? I can view the source by right clicking the home page. However it's a wordpress site and I'm not seeing an index.html file.

    Thanks.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •