Posted by pfx75 on June 1, 2009 at 12:53pm
| Project: | Image Resize Filter |
| Version: | 6.x-1.4 |
| Component: | User interface |
| Category: | feature request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | closed (fixed) |
Issue Summary
I use FileField Insert + Image resize Filter (Link to the original) + Lightbox with success !!!
when click my image LightBox is launch and the image is shown but not image's title...
thanks
Comments
#1
I don't use LightBox so you'll have to be more clear about where the problem exists. I think that LightBox uses the "title" attribute to make the title when you click on the image but I'm not entirely sure. Is this what's missing from the HTML? Did you enter a title and alt value into the ImageField before inserting the image? Note that FileField Insert only helps in inserting HTML, it can't update the HTML after it's been inserted, so changing the title and alt values afterwards does not have an effect on the HTML inserted previously.
#2
Yes I put the title and alt value into the ImageField then In use "send to text area" (wysiwyg api + fckeditor) If I turn off RTE I see the tag's title and alt have been well inserted in
.
Perhaps the problem come from the Image resize filter : I select "Link to the orginal" and put "rel attribute:" to lightbox to be able to see my image in lightbox when I click on it and that works... but what is the original's image title that lightbox is supposed to link or use? not the same that is inserted by FileField Insert.
excuse my english...
thanks for this great module
#3
The link itself doesn't have a title attribute, the "alt" and "title" attributes will be maintained on the original image though. Do you need the title attribute to be on the link for it to work with LightBox? Could you provide an example of the HTML that you need, compared with the HTML that is currently being output?
#4
Yes in a working exemple the title attribute is in link attribute:
<a title="Comment la rivière façonne-t-elle le paysage ?" href="/sites/default/files/images/utilisateur9/2009-04-23/geol1.JPG" rel="lightbox"><img src="/sites/default/files/images/utilisateur9/2009-04-23/large_geol1.JPG" alt="" height="180" width="180">you can see it at my site ecl-barral.fr : node Sortie "Géologique des Cinquièmes"
So lightbox use title's attribute in the link for the output...
As I understand Image resize filter put reI="lightbox" attribute in the link to orginal image. I thought this filter use the title attribute of the original image and put it in a link for output in lightbox... So we are unable to output any title in lightbox this way because the link is produce by the filter and is not visible in the HTML code...
#5
Let's do this in Image Resize Filter, since FileField Insert isn't making the link at all. I don't think it'd be unreasonable to simply always output the image "title" attribute on the parent link, even though it's a bit redundant.
Marking #479916: linking to the original lightbox as duplicate.
#6
#7
I give a try with thickbox and the logic is the same that for lightbox. It use title attribute that come from link and not from image... Image resize filter may give a option to put some title attribute in the link.
#8
Would love to see this working
#9
Subscribing
#10
Would also like to see this so the lightbox has a caption via the title attribute. thanks.
#11
Is it possible for image resize to add a class to the image markup?
Currently I have assigned the filter to add class='popup' to the link and a rel='lightbox' tag. This is added to the href not the image.
The Lightbox2 title will display in the css overlay/popup if I manually assign the lightbox2 trigger class (in my case it is called popup) to the image.
I think the neatest solution to this issue (if it understand correctly) is to set up a lightbox2 triggerclass in 'admin/settings/lightbox2/automatic > custom class images' and to get image resize filter to assign the class to the resized images.
I hope that makes sense.
PS thanks for the great module it stopped me loosing the will to deal with inline images :)
#12
I've added this as a non-configurable option. If an image has a title, then the link is automatically assigned the same title.
#13
I don't have a title set on the inline image, just an alt tag. I think Lightbox2 falls back to using the alt tag for the captions if no title is present. Sorry I didn't make this clear.
I'm using full HTML filter with WYSIWYG, IMCE & FCKEditor.
The only title option for an inline image is the 'Advisory title' field in the advanced tab of IMCE's image popup.
It's another step for users that I was hoping to avoid by using the Alternate text as Lightbox2 does. They could just enter the popup class on the same tab to have Lightbox2 automatically pull in the alt as caption instead.
The patch does set the Lightbox caption to the Advisory title.
I don't know if just adding a 'trigger class' to the image code to activate the titles is a bad idea or not.
#14
Unfortunately "alt" is not a property that is normally assigned to anchor tags. The purpose of ALT is to describe the image in the situation that the image cannot be displayed or loaded, or when using accessibility software such as a screenreader.
So if the request was to add "alt" to the link, this will not happen. I'm fine with be accommodating for Lightbox, but I don't won't completely throw accessibility and the proper use of tags out the window.
#15
I'm not asking for the link to be modified, it is the image tag that needs to have a class assigned to it.
If the image gets a class that triggers lightbox2 for inline images then it will use the alt for the caption.
I agree it is an incorrect usage of the Alternate tag, but it is lightbox2 that is doing the fall back and using the alt instead of the title field.
In a perfect world users would always enter alternate text & a title (and understand the difference between them), but that doesn't happen when they need to use 2 tabs in the IMCE file editor.
I took a look at the module code, but I couldn't figure out the regex's, maybe a code example will help.
Two images are inserted into node body via IMCE, the first one has a class (popup) assigned to the image.
This is the source in the body for both images…
Image A - Lightbox2 'alt as Title' Works on this one
<a title="Windows Mobile Today Screen" href="/sites/default/files/syncmate_review/wm_01.jpg"><img height="152" width="120" alt="Windows Mobile Today Screen" class="popup" src="/sites/default/files/user_files/wm_01.jpg" /></a>Image B - Lightbox2 'alt as Title' doesn't work
<a href="/sites/default/files/syncmate_review/SyncMate-iTunes.jpg"><img height="99" width="120" class="triggerclass alignleft mceItem" alt="Syncing with iTunes" src="/sites/default/files/user_files/SyncMate-iTunes.jpg" /></a>TheThis is what is shown on the resulting node view.
Image A - Lightbox2 'alt as Title' Works on this one
<a rel="lightbox[][Windows Mobile Today Screen]" class="popup lightbox-processed" href="/sites/default/files/user_files/wm_01.jpg"><img height="152" width="120" class="popup" src="/sites/default/files/resize/user_files/wm_01-120x152.jpg" alt="Windows Mobile Today Screen" title="Windows Mobile Today Screen"/>
</a>
Image B - Lightbox2 'alt as Title' doesn't work
<a rel="lightbox" class="popup lightbox-processed" href="/sites/default/files/user_files/SyncMate-iTunes.jpg"><img height="99" width="120" class="triggerclass alignleft mceItem" src="/sites/default/files/resize/user_files/SyncMate-iTunes-120x99.jpg" alt="Syncing with iTunes"/>
</a>
I think that the popup class (my lightbox2 trigger class) causes lightbox2 to add the extra info to the 'rel' tag for the title.
#16
Automatically closed -- issue fixed for 2 weeks with no activity.