![]() |
#1 |
Enthusiast
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 47
Karma: 415790
Join Date: Feb 2012
Device: android phone, Kobo Aura, Sony PRS 350
|
Image overlayed over text (but text visible if image disabled)?
I know I saw a way to do this in a web page before and I'd like to try it for an ePUB to maintain accessibility etc but cannot find the reference now.
Has anyone done this in an ePUB? Specifically I am thinking of the first letter in a chapter. Instead of dropcaps I have a fancy image of the letter but if for some reason the letter is not visible, or someone is using a dictator I want the letter to still BE there (because not all will read the "alt" info of an image). I also thought I had an example of such in an epub but apparently not...Three Men in a Boat does have the nice image first letters but I'm not seeing code that shows the letter still there (other than the alt attribute in the image tag). I dug through some of the code snippet pages but didn't see anything (and much of the code snips do not have an accompanying example image that would greatly help me spot what code I'm looking for. Pet peeve there.) Help? |
![]() |
![]() |
![]() |
#2 |
frumious Bandersnatch
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 7,527
Karma: 19000001
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
I guess something could be done, but what if the image is partially transparent? you'd see the letter behind it (forcing a white background on the image may not be a good idea if the user is not using a white page background). Also, the z-index CSS property, that would be useful for this, is not supported by ePub 2.01.
|
![]() |
![]() |
Advert | |
|
![]() |
#3 |
Color me gone
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 2,089
Karma: 1445295
Join Date: Apr 2008
Location: Central Oregon Coast
Device: PRS-300
|
Please check out anything you do in your Sony 350. There are things that might look to work on Sigil or other program that will create problems on your Sony. Just download some of the epubs from gutenberg.ca and you will see the effect -- One big letter and your first sentence jammed to the right side of the page.
|
![]() |
![]() |
![]() |
#4 |
Enthusiast
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 47
Karma: 415790
Join Date: Feb 2012
Device: android phone, Kobo Aura, Sony PRS 350
|
Jellby : Yes the images would have to be solid for it to work. (and I don't foresee needing to use partially transparent images in my situation). I thought for sure I had a way to do it but must not have bookmarked it...
mrmikel: yes, I will test before releasing to the wilds. |
![]() |
![]() |
![]() |
#5 |
frumious Bandersnatch
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 7,527
Karma: 19000001
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
Maybe this is useful for you: http://www.pgdp.net/wiki/Accessibility_Recipes/Dropcaps
But the code may not work so well in ePub readers, and the amount to move the text changes from letter to letter (and font to font!). I wonder if it's better to have duplicated code toggled through media types (assuming this is supported by ePub readers and text-to-speech software). |
![]() |
![]() |
Advert | |
|
![]() |
#6 |
Enthusiast
![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Posts: 47
Karma: 415790
Join Date: Feb 2012
Device: android phone, Kobo Aura, Sony PRS 350
|
Thanks Jellby!
That looks like it may work...but you're right, I could see it having issues with lots of eReaders....ignoring one or both of the codes cause it to mess up easily...maybe I'll leave off it for now (wait for eReaders and their OS to finally follow standards like they should....oh look a flying pig.) |
![]() |
![]() |
![]() |
|
![]() |
||||
Thread | Thread Starter | Forum | Replies | Last Post |
PRS-350 Overlayed text | gbuergisser | Sony Reader | 5 | 11-23-2011 01:09 PM |
Hello/Image and text alignment | Derek R | Introduce Yourself | 3 | 06-26-2011 10:47 AM |
How to make image visible? | ppharm | 2 | 01-11-2011 06:40 AM | |
wrapped text around an image | Ambar | ePub | 2 | 07-05-2010 08:55 AM |
text and image | pimpoum | 2 | 05-31-2009 04:26 AM |