0

I've tried adding title="" but my alt text still appears when I hover over the photos in FF and Safari...

Anything else I can try?

Here's my example page:

http://ianmartinphotography.com/test-site/wedding-01/

Thanks!

skaffman
  • 398,947
  • 96
  • 818
  • 769
ian_6500
  • 358
  • 2
  • 10
  • 21
  • No idea about this ... but another comment about your page: The text is cut off at the (lower) border of the browser window, with no way to scroll. – Paŭlo Ebermann Mar 12 '11 at 10:28
  • @Paŭlo, thank you for pointing that out, what are your browser window dimensions? – ian_6500 Mar 12 '11 at 17:38
  • The height of the browser viewport (in Opera, Linux) is 497 pixels (from 600 of my screen), the width is the full 800 pixels. The first line of text ends with **into his fiancee's**, the second line is not visible anymore (apart from some single top pixels which show me that there is a second line). If I zoom the whole page to about 75%, I can see everything (but in worse quality, it seems). – Paŭlo Ebermann Mar 12 '11 at 22:54
  • @Paŭlo, thanks for checking that out. According to my google analytics, people seldom visit my site with a screen res of less than 1024x768, so with a browser with all of the bookmark and tool bars open, there should still be enough room in the window for the whole page for most of my visitors, so I've optimized the site for them. (I want them to open the window wide enough to see the whole page at once.) Thanks again for you time! – ian_6500 Mar 13 '11 at 21:59
  • 1
    Simply make sure there is a scrollbar **whenever it does not fit**, like in my case. – Paŭlo Ebermann Mar 14 '11 at 11:20

4 Answers4

0

You have to affect the ALT tag, not title.

Your image tag looks like this:

<img src="photos/half-moon-bay-wedding/bride-ready-for-wedding.jpg" title="" alt="Bride ready for wedding in black and white." style="position: absolute; display: block; z-index: 0; height: 467px; width: 730px; left: 0px; top: 0px; visibility: visible; zoom: 1; opacity: 1; " height="467" width="730">

This is what cause you trouble:

title="" alt="Bride ready for wedding in black and white."

Or perhaps saying; That's what cause you an fully expected result!

Independent
  • 2,924
  • 7
  • 29
  • 45
0

It is not the alt attribute what causes your problem. It is the following:

<a href="#slide-0" title="Bride ready for wedding in black and white."><img src="photos/thumbnails/bride-ready-for-wedding.jpg" title="" alt="" style="display: none; position: absolute; z-index: 1; "><img src="photos/half-moon-bay-wedding/bride-ready-for-wedding.jpg" title="" alt="Bride ready for wedding in black and white." style="position: absolute; display: block; z-index: 2; height: 467px; width: 730px; left: 0px; top: 0px; visibility: visible; zoom: 1; opacity: 1; " height="467" width="730"></a>

Images are inside anchors, and the links get a title attribute which gets shown.

the_drow
  • 18,571
  • 25
  • 126
  • 193
vbence
  • 20,084
  • 9
  • 69
  • 118
  • e.preventDefault() avoids the click event? (ok vbence, that was a Complete refactoring of your post :p) – Independent Mar 12 '11 at 10:24
  • I edited the comment since the cause was different than I originally surmised. – vbence Mar 12 '11 at 10:24
  • @dingir It only does if you prevent an `click` (or its two sub-events). In case of `mouseenter` I don't think it would have any negative effects. – vbence Mar 12 '11 at 10:26
  • @dingir Yep, when I could not reproduce the results I looked at the source and found the `a` tag with the title. Anyway I will test my theory about `preventDefault` and tooltips. – vbence Mar 12 '11 at 17:57
0

I'm assuming it's related to the jQuery your using for the "display box", perhaps read over the readme or something. However, I noticed this in your code

<img id="slide-0" src="photos/half-moon-bay-wedding/bride-ready-for-wedding.jpg" alt="Bride ready for wedding in black and white." title=" "  /></a> 

Why do you have </a>? There is no hyperlink that needs to be closed.

Update After looking over your code I found this line

var caption = $pick(img.get('alt'), img.get('title'), '');

(located in http://ianmartinphotography.com/test-site/wedding-01/js/slideshow.js) Try removing (img.get('alt'), see if that helps

itsdaniel0
  • 1,059
  • 3
  • 11
  • 28
0

Okay! My bad--I'm using Mootools Slideshow2 http://code.google.com/p/slideshow/ The show defaults to having titles on, it converts alt text into titles. I simply changed titles from "true" to "false" in slideshow.js and the problem is solved. I feel a bit silly, I should have thought of that right away. Thanks for your attention everyone!

ian_6500
  • 358
  • 2
  • 10
  • 21