Register Guidelines E-Books Search Today's Posts Mark Forums Read

Go Back   MobileRead Forums > E-Book Formats > ePub

Notices

Reply
 
Thread Tools Search this Thread
Old 10-30-2014, 07:38 PM   #1
Julanna
Member
Julanna began at the beginning.
 
Julanna's Avatar
 
Posts: 19
Karma: 10
Join Date: Jun 2014
Device: Kobo e-ink, Samsung Galaxy Note II with 4 readers, desktop PC, lappy
Question Highlighting linked text

Hi, I had an idea, and I am going though CSS info to see if I can solve it but posting here may be quicker. I have a name index in a small non-fiction book. Coding works well: <a href="#IsaacWoolley">Woolley, Isaac</a> and <span id="IsaacWoolley">Isaac Woolley</span> (thanks to the fabulous people on these forums) but a friend suggested that when the link is clicked on the text should highlight. Sensible idea really. Only when the link is clicked. I've seen this on web pages but I've never coded it up. Ideas?

Last edited by Julanna; 10-30-2014 at 10:24 PM. Reason: typo, thinks to thanks ....shakes head
Julanna is offline   Reply With Quote
Old 10-30-2014, 09:28 PM   #2
eschwartz
Irrational Optimist
eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.
 
eschwartz's Avatar
 
Posts: 8,312
Karma: 14762383
Join Date: Nov 2012
Location: The Beaten Path, USA, Roundworld, This Side of Infinity
Device: Kindle Touch fw5.3.7 (Wifi only)
See: http://www.w3schools.com/cssref/sel_hover.asp

I don't know which devices actually support that, though... Chances are not good on E-ink devices. On the other hand, it can hardly hurt* to include CSS which will just be ignored.
eschwartz is offline   Reply With Quote
 
Advertisement
Old 10-30-2014, 10:24 PM   #3
Julanna
Member
Julanna began at the beginning.
 
Julanna's Avatar
 
Posts: 19
Karma: 10
Join Date: Jun 2014
Device: Kobo e-ink, Samsung Galaxy Note II with 4 readers, desktop PC, lappy
No, not highlight when the link itself is hovered over. It the linked *to* text I want the highlight. The 'span id' part. I've got this horrid feeling it's not CSS that does that, it's javascript. I hope not! I'll have to try to hunt up a web page that does it as an example.

And yeah, it won't be relevent to e-ink, but those who read it on things where you could use a mouse or touch screen should find it useful.
Julanna is offline   Reply With Quote
Old 10-30-2014, 10:58 PM   #4
eschwartz
Irrational Optimist
eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.eschwartz ought to be getting tired of karma fortunes by now.
 
eschwartz's Avatar
 
Posts: 8,312
Karma: 14762383
Join Date: Nov 2012
Location: The Beaten Path, USA, Roundworld, This Side of Infinity
Device: Kindle Touch fw5.3.7 (Wifi only)
Quote:
Originally Posted by Julanna View Post
No, not highlight when the link itself is hovered over. It the linked *to* text I want the highlight. The 'span id' part. I've got this horrid feeling it's not CSS that does that, it's javascript. I hope not! I'll have to try to hunt up a web page that does it as an example.

And yeah, it won't be relevent to e-ink, but those who read it on things where you could use a mouse or touch screen should find it useful.
That does sound like javascript. I cannot think of any CSS which would have that effect.
eschwartz is offline   Reply With Quote
Old 10-31-2014, 03:40 AM   #5
Julanna
Member
Julanna began at the beginning.
 
Julanna's Avatar
 
Posts: 19
Karma: 10
Join Date: Jun 2014
Device: Kobo e-ink, Samsung Galaxy Note II with 4 readers, desktop PC, lappy
Thanks anyway eschwartz. It's been an interesting trip, trying to work out non-fiction with and index. Every ereader I use (that can make use of a linked index) puts the 'linked to' text on the page somewhere but not at the top, and even the paragraph isn't at the top. In a lot of ways it's as if they are trying to mimic paper books. I see that as a lost opportunity. On the html version of the book at least the 'linked to' text is on the top line so it's easy to find it. There's been some talk lately about books in browsers may be gaining ground and after this little foray I think that may be correct, at least for non-fiction. Fiction is a lot easier in ereaders of any sort.
Julanna is offline   Reply With Quote
Old 10-31-2014, 06:56 AM   #6
odedta
Addict
odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.
 
Posts: 302
Karma: 95952
Join Date: Dec 2013
Device: iPad
@Julanna, here is the code to do that:
Code:
a:active {
    background-color: black;
    color: white;
}
odedta is offline   Reply With Quote
Old 10-31-2014, 05:52 PM   #7
DomesticExtremis
Groupie
DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.
 
DomesticExtremis's Avatar
 
Posts: 165
Karma: 321698
Join Date: Nov 2012
Device: default
Quote:
Originally Posted by Julanna View Post
No, not highlight when the link itself is hovered over. It the linked *to* text I want the highlight. The 'span id' part. I've got this horrid feeling it's not CSS that does that, it's javascript. I hope not! I'll have to try to hunt up a web page that does it as an example.

And yeah, it won't be relevent to e-ink, but those who read it on things where you could use a mouse or touch screen should find it useful.
Well, the pseudo selectors aren't restricted to the <a> tag.

I'm not sure which ones are appropriate, but you might try something like:

Quote:
.hl:visited { background-color: #ff0000; }


<a href="#IsaacWoolley">Woolley, Isaac</a> and <span class="hl" id="IsaacWoolley">Isaac Woolley</span>

Last edited by DomesticExtremis; 10-31-2014 at 05:55 PM.
DomesticExtremis is offline   Reply With Quote
Old 10-31-2014, 08:04 PM   #8
Julanna
Member
Julanna began at the beginning.
 
Julanna's Avatar
 
Posts: 19
Karma: 10
Join Date: Jun 2014
Device: Kobo e-ink, Samsung Galaxy Note II with 4 readers, desktop PC, lappy
Odeta that would be on the link itself, I'm wanting the 'linked to' text to be highlighted. DomesticExtremis, it didn't work it Chrome or FF. I could see how it should work but it didn't .... thanks anyway!
Julanna is offline   Reply With Quote
Old 11-01-2014, 04:37 AM   #9
odedta
Addict
odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.
 
Posts: 302
Karma: 95952
Join Date: Dec 2013
Device: iPad
Right, that means that there is absolutely no solution without Javascript here, the script would be extremely simple so if a device will support Javascript, it will work.

If you want the footnote itself highlighted why not keep it that way all the time, footnotes are not on the same page of the text anyway...
odedta is offline   Reply With Quote
Old 11-01-2014, 06:19 AM   #10
Jellby
frumious Bandersnatch
Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.Jellby ought to be getting tired of karma fortunes by now.
 
Jellby's Avatar
 
Posts: 6,310
Karma: 4898871
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
Without javascript, you can use the :target selector, which will probably not work in ePub readers:

Code:
<a href="#IsaacWoolley">Woolley, Isaac</a> and
<span id="IsaacWoolley" class="hl">Isaac Woolley</span>

.hl:target { background-color: #F99; }
Try it here.

Last edited by Jellby; 11-01-2014 at 06:22 AM.
Jellby is offline   Reply With Quote
Old 11-01-2014, 07:43 AM   #11
odedta
Addict
odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.odedta knows how to set a laser printer to stun.
 
Posts: 302
Karma: 95952
Join Date: Dec 2013
Device: iPad
Quote:
Originally Posted by Jellby View Post
Without javascript, you can use the :target selector, which will probably not work in ePub readers:

Code:
<a href="#IsaacWoolley">Woolley, Isaac</a> and
<span id="IsaacWoolley" class="hl">Isaac Woolley</span>

.hl:target { background-color: #F99; }
Try it here.
wtf! lol Jellby, you pulled that one from hell
odedta is offline   Reply With Quote
Old 11-02-2014, 12:39 AM   #12
Julanna
Member
Julanna began at the beginning.
 
Julanna's Avatar
 
Posts: 19
Karma: 10
Join Date: Jun 2014
Device: Kobo e-ink, Samsung Galaxy Note II with 4 readers, desktop PC, lappy
huh. Jellby, looks good, I'll try again, I'll post back in after I've finished playing with it!
Julanna is offline   Reply With Quote
Old 11-02-2014, 01:44 AM   #13
Julanna
Member
Julanna began at the beginning.
 
Julanna's Avatar
 
Posts: 19
Karma: 10
Join Date: Jun 2014
Device: Kobo e-ink, Samsung Galaxy Note II with 4 readers, desktop PC, lappy
Jellby, it's a fab solution for the html version but it doesn't display in either ADE or the Calibre reader. Sigh, so close. Of course this just takes me a step closer to the idea that's been in the media that non-fiction ebooks are better in browsers anyway. Thanks!
Julanna is offline   Reply With Quote
Old 11-03-2014, 12:16 AM   #14
DomesticExtremis
Groupie
DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.DomesticExtremis ought to be getting tired of karma fortunes by now.
 
DomesticExtremis's Avatar
 
Posts: 165
Karma: 321698
Join Date: Nov 2012
Device: default
it doesn't work on my e-Reader either (though it's fine in a browser),
but I didn't expect it to - they only do a subset of css after and even
less of a subset of css3.
DomesticExtremis is offline   Reply With Quote
Old 11-04-2014, 04:16 AM   #15
Hitch
Bookmaker & Cat Slave
Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.Hitch ought to be getting tired of karma fortunes by now.
 
Hitch's Avatar
 
Posts: 2,659
Karma: 15280959
Join Date: Apr 2010
Location: Phoenix, AZ
Device: Kindle2, iPad, KindleFire and NookColor
Quote:
Originally Posted by Julanna View Post
Thanks anyway eschwartz. It's been an interesting trip, trying to work out non-fiction with and index. Every ereader I use (that can make use of a linked index) puts the 'linked to' text on the page somewhere but not at the top, and even the paragraph isn't at the top.
That's because of the way that indices are created. If you have created indices in print, you already know the "why" of this. When a print book index is created, it places the "tag," the identifying marker, in the very first position of the upper-left-hand edge of the page, before the first letter of the first word of the first line of the text. This means that in print, it's fine; it is simply identifying the page location. However, when you export that to HTML, the "marker" is now relatively the same "distance away" from the target text, as we'll call it here, as it was before. Forget being "on the same paragraph;" in many e-readers, it will be 2-3 pages (clicked screens) away from the linked text.

The only alternative to this is to make the target ITSELF a link. This means--and many publishers are not enamored of this idea--making the linked target a blue, linked piece of text. OR, inserting something akin to a footnote, but now remember--you're working backwards. The reader would see the link location, but not know what it's for; if they click it, they'd go to the index.

And, this situation gets more complex if multiple items in the index point to the same target. Let's say a paragraph on "Irish setters" is referenced (indexed) in 3 places: Hunting Dogs, Setters, and alphabetically, "Setters, Irish." you could easly have all three source indices jump TO the entry--but then, how does the reader get back to where she was? In the index? You can't have a multiple-location link, that magically takes a reader back to the place they WANT to go; it has to be the place that they can reliably click and GO.

Creating competent indexes is not simple. It's not easy. It's not an "overlooked opportunity." It's a lot--a LOT--of work to do well; it's easy to do badly; it's hard to do if you have enormous, complex indices, both for the multi-linking issue mentioned above, and the "how" of how to mark the target, so that the index can jump TO it. Moreover, how do you indicate what the entries ARE, in an index item that has, say, 10 targets? A, B, C...? You can't use page numbers any longer, as those are obsolete and useless. You could, arguably, keep the DT page numbers, and use those as the anchors, but either way, it's a lot of painstaking work. If you're creating these deep indices from scratch, then keeping track of all of them, naming conventions, etc. (and the infamous, "how to jump back" issue), is a giant pain in the ass.

Quote:
In a lot of ways it's as if they are trying to mimic paper books. I see that as a lost opportunity. On the html version of the book at least the 'linked to' text is on the top line so it's easy to find it. There's been some talk lately about books in browsers may be gaining ground and after this little foray I think that may be correct, at least for non-fiction. Fiction is a lot easier in ereaders of any sort.
If a target is simply identified with a plain link, the jump "to" will ALWAYS land the target text at the top of the screen, except in fixed-format books. When you see a book where this is not true, the target is the aforementioned "marker" that was placed at the upper-left-hand-corner of the page. Otherwise, the linked-to text will always scroll to the top of the page.

Nobody--anywhere--is trying to mimic paper books. It's the creation mechanisms involved that are causing what you see. When publishers are willing to pay for the painstaking type of index creation you want--and when you think about it, why on earth would they, when "search" is right at every reader's fingertips???--then the indices will work the way you want them to. But right now, most don't want to pay for the hours it takes to do it right.

Hitch
Hitch is offline   Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Highlighting text in Calibre? adrenaline Calibre 6 10-13-2014 04:36 AM
Highlighting Text valarcher Devices 7 01-13-2014 09:15 PM
Glo Highlighting text only works for a while RobertJSawyer Kobo Reader 9 02-01-2013 05:53 PM
Highlighting text?? my3monkees Android Devices 7 03-16-2012 07:25 PM
Highlighting text in a PDF... Michealj enTourage Archive 15 01-26-2011 11:10 PM


All times are GMT -4. The time now is 12:03 AM.


MobileRead.com is a privately owned, operated and funded community.