 |
 | Home | Contact Us | FAQ | Search & Site Map | Link to Us |
 | Sign In | Join | Other 45 Sites in Network |
| HomeDiscussion GroupsGeneralPHPASPPerlColdFusionFlashHTML, CSS, ScriptsBrowsers |
Webmaster Forum / HTML, CSS, Scripts / CSS / November 2005Making tooltips stay longer...
Hi, Is there a way to make windows tooltips stay up longer than the default 5 seconds using CSS in a web page? I'd prefer to have it stay visible as long as the mouse is over the "whatever." The reason: I've been creating web pages and using various javascripts for the tooltip popups, and they are fine and very "tweakable." But, I'd prefer to just use the "title" and/or the "alt" attribute and somehow alter it so that viewers to my pages can read the entire tooltip before it disappears. Thanks! PlainDave DDAS Web Design <--(wishful thinking!) >Is there a way to make windows tooltips No such thing, a visual browser may display title content in a pop up box, but it may also (be configured to) do nothing with it. Nowt to do with a particular OS. >stay up longer than the default >5 seconds using CSS in a web page? Again no such thing, there is no "default". Any pop up box display duration will vary across browsers and fortunately there's nothing web code can do to change that duration. >I'd prefer to have it stay visible >as long as the mouse is over the "whatever." The reason: I've been >creating web pages and using various javascripts for the tooltip >popups, and they are fine and very "tweakable." But, I'd prefer to just >use the "title" and/or the "alt" attribute and somehow alter it so that >viewers to my pages can read the entire tooltip before it disappears. You could use a CSS method to display text on hover, but to display alt or title attribute content would require a browser that supports generated content, needless to say that this doesn't include IE. If IE compatibility is required all you could do is insert the text as page content in the document, hide it by default and then revealing it on mouse over. Needless to say that you should consider if coding such text as page content is appropriate, your document should work with CSS disabled. I'd suggest that there is a reason why "tooltip" pop ups disappear after a certain time, they obscure/cover part of the display. If a user needs more time to read the content you should ask yourself if you are using the title attribute and its content appropriately. Appropriately used, if a user wants more time to read he/she will be able to move the focus off and back on again to make it reappear.  SignatureSpartanicus Thu, 24 Nov 2005 10:54:14 GMT from Spartanicus <invalid@invalid.invalid>: > Again no such thing, there is no "default". Any pop up box display > duration will vary across browsers and fortunately there's nothing web > code can do to change that duration. It would be nice, however, if the user could vary that by browser settings. If there's a way to do it in Mozilla, I couldn't find it n "about:config". SignatureStan Brown, Oak Road Systems, Tompkins County, New York, USA http://OakRoadSystems.com/ HTML 4.01 spec: http://www.w3.org/TR/html401/ validator: http://validator.w3.org/ CSS 2.1 spec: http://www.w3.org/TR/CSS21/ validator: http://jigsaw.w3.org/css-validator/ Why We Won't Help You: http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you How does one use a CSS method to display text on hover? That would be perfect for my needs, or at least it would be nice to know. Thanks! PlainDave > You could use a CSS method to display text on hover, but to display alt -----snip----- PlainDave wrote on 24 nov 2005 in >> You could use a CSS method to display text on hover, but to display alt [please do not toppost on usenet] > How does one use a CSS method to display text on hover? That would be > perfect for my needs, or at least it would be nice to know. Thanks! <style ...> a.showHovering {visibility:hidden;} a.showHovering:hover {visibility:visible;} ....................... <a href='#' class='showHovering'>Hello!</a> SignatureEvertjan. The Netherlands. (Replace all crosses with dots in my emailaddress) > [please do not toppost on usenet] Sorry about that. I've been using USENET for about 10 1/2 years, and I had to look up "toppost" to see what you were talking about. I really should read more! :-) > <style ...> > a.showHovering {visibility:hidden;} > a.showHovering:hover {visibility:visible;} I put the above in the head tag, and I put the line below in the body of my test page. For some reason, I can't get anything to show up on the page. > <a href='#' class='showHovering'>Hello!</a> Am I supposed to see "Hello!"? Any help would be highly appreciated. PlainDave PlainDave wrote on 25 nov 2005 in comp.infosystems.www.authoring.stylesheets: > Am I supposed to see "Hello!"? Any help would be highly appreciated. This will work, IE&FF tested, first try it in a seperate HTML: ============ HoverTest.html ============== <style type="text/css"> a.showHovering {color:navy;background-color:navy; font-size:20pt;padding:20px;} a.showHovering:hover {color:yellow;} </style> <body> <a href='#' class='showHovering'>Hello!</a> =========================== SignatureEvertjan. The Netherlands. (Replace all crosses with dots in my emailaddress) >PlainDave wrote on 25 nov 2005 in >comp.infosystems.www.authoring.stylesheets: [quoted text clipped - 17 lines] > >=========================== It only works correctly in Opera (8.51) for me... MSIE and FF ignore the background colour and the Font-size... SignatureChris Hughes "Reality is that which, when you cease to believe, continues to exist." http://www.epicure.demon.co.uk The Major wrote on 25 nov 2005 in comp.infosystems.www.authoring.stylesheets: >>PlainDave wrote on 25 nov 2005 in >>comp.infosystems.www.authoring.stylesheets: [quoted text clipped - 20 lines] > It only works correctly in Opera (8.51) for me... MSIE and FF ignore the > background colour and the Font-size... I cannot believe that. Sorry. SignatureEvertjan. The Netherlands. (Replace all crosses with dots in my emailaddress) > PlainDave wrote on 25 nov 2005 in > comp.infosystems.www.authoring.stylesheets: [quoted text clipped - 17 lines] > > =========================== This is not coming near any tooltip I would recommend. A tooltip that would work (though not in IE, so for IE there is the ol' title attribute) is more like: <URL:http://home.wanadoo.nl/b.de.zoete/_test/tooltips_with_markup_and_css.html> Signature,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------. | weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html | | webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html | |zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html | `-------------------------------------------------- --<--@ ------------' > This is not coming near any tooltip I would recommend. A tooltip that > would work (though not in IE, so for IE there is the ol' title attribute) > is more like: > > <URL:http://home.wanadoo.nl/b.de.zoete/_test/tooltips_with_markup_and_css.html Looks very nice in Safari on Macintosh. Bold white headline on a blue background, yellow background on the text, and a nice border, with the tooltip at the left hand margin. The cursor changes from arrow to question mark. Opera 8.02 on Mac displays the tooltips just after the word, as does Firefox, rather than in the left hand margin. Opera fails to display the cursor change to a question mark. Firefox adds the question mark next to the usual arrow cursor. Sounds like a pretty graceful fallback to me. I was just wondering why the Google advertisment was only visible in Firefox, but I realised I had Javascript off in the others. I am however at a total loss as to where you styled <acronym title="Internet Explorer" class="definition">IE</acronym> to have a dotted black (not maroon) underline. It shows up in Firefox and Opera, but not Safari. Signaturehttp://www.ericlindsay.com [...] > > <URL:http://home.wanadoo.nl/b.de.zoete/_test/tooltips_with_markup_and_css.html> [...] > I am however at a total loss as to where you styled <acronym > title="Internet Explorer" class="definition">IE</acronym> to have a > dotted black (not maroon) underline. It shows up in Firefox and Opera, > but not Safari. Browser's built-in Style Sheet. To the best of my knowledge, this one started with iCab, whose built-in Style Sheet did this many years ago already. I liked it and stole it - added ABBR, ACRONYM {border-bottom: dotted; cursor:help} to my site. I think it was Eric Meyer who picked that up and gave it so much widespread attention that it ended up with some browser developers adding it to the built-in Style Sheet. Now let's see if 5 years from now we can similarly look back on user-friendlier hyperlinks: <http://www.euronet.nl/~tekelenb/WWW/userfriendlierhyperlinks/> :) SignatureSander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/> > > I am however at a total loss as to where you styled <acronym > > title="Internet Explorer" class="definition">IE</acronym> to have a > > dotted black (not maroon) underline. It shows up in Firefox and Opera, > > but not Safari. > > Browser's built-in Style Sheet. Doh! Thanks for explaining that Sander. Not being able to figure out where that came from was driving me nuts. > Now let's see if 5 years from now we can similarly look back on > user-friendlier hyperlinks: > <http://www.euronet.nl/~tekelenb/WWW/userfriendlierhyperlinks/> :) I like it. Be a bit of work to add types to links, given most of us probably haven't any idea exactly which MIME type matches whatever method is used to identify files in our particular operating system. However I guess most people don't use a lot of links to things that are not web pages. Hmm, is Windows still using file extensions to match files to applications? OS X seems to have now started moving to UTI, and maps back to MIME and file extensions back to them. Maybe I can ask the OS to supply the MIME type, since Spotlight should know the UTI. Still, I'm pretty sure I would only have a dozen or so files on my web site that are not web centered html, or jpg or gif. Wouldn't take much to add a type attribute to all the pointers to pdf. Hmm. I think I'll do it. I take it IE and Opera ignore it completely, like they should, rather than doing something silly? Signaturehttp://www.ericlindsay.com [...] > > <http://www.euronet.nl/~tekelenb/WWW/userfriendlierhyperlinks/> :) > > I like it. Be a bit of work to add types to links, given most of us > probably haven't any idea exactly which MIME type matches whatever > method is used to identify files in our particular operating system. Well, if you serve files on the Web, you'd better make sure your server provides proper Content-Type headers, so you need to know the right MIME types anyway. I don't think adding TYPE attributes changes that. For people who use HTML-generating tools, those tools could easily automagically insert a proper TYPE attribute. (Which doesn't cover it all - a correct TYPE attribute alone still leaves the issue of having to configure the server to send proper Content-Type headers.) > However I guess most people don't use a lot of links to things that are > not web pages. That's part of the problem :) Most links point to Web pages, so one pointing to a PDF often surprises people. > Hmm, is Windows still using file extensions to match > files to applications? OS X seems to have now started moving to UTI, > and maps back to MIME and file extensions back to them. Maybe I can ask > the OS to supply the MIME type, since Spotlight should know the UTI. For Mac OS X, RCDefaultApp provides convenient acces to this aspect of LaunchServices. To check what Content-Type your server sends, you can use iCab (through its log function) or lynx or curl: $ lynx -head -dump <URL> $ curl -I <URL> curl is part of the default Mac OS X install. [...] > I take it IE and Opera ignore it completely, like they should, > rather than doing something silly? That's my experience, yes. But even if they would do something silly, IMO that's no good reason to change your HTML/CSS. The more Web publishers try to hide bugs in browsers, the less incentive for those browsermakers to fix those bug. Better to have those bugs visible. SignatureSander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/> [...] > A tooltip that > would work (though not in IE, so for IE there is the ol' title attribute) > is more like: > > <URL:http://home.wanadoo.nl/b.de.zoete/_test/tooltips_with_markup_and_css.html> This sort of thing of course looks very appealing at first sight, but in the end CSS-dependancy never is a good idea. Just think of how this would look to a search engine, or any other user-agent that doesn't speak CSS: "Let's see how one can create a tooltip Tooltip: a small, informative text that pop's up in the browser screen, if a visitor has a mouse pointer hovering over an element with markup Markup: code that gives structure and meaning to content and CSS CSS, Cascading Style Sheets: a way to layout and format the content, if well structured ." Instead of "Let's see how one can create a tooltip with markup and CSS ." SignatureSander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/> > [...] > [quoted text clipped - 9 lines] > would look to a search engine, or any other user-agent that doesn't > speak CSS: I agree and do explain that in that very same page when I say: <quote> Keep in mind that in a text browser all is visible at once (the content that has a tooltip and the tooltip itself and the replacement content for IE too). This can be a bit much and you can't setup a special style sheet for a text browser, now can you. This also means that visitors that don't actually see the content (but get it through an aural browser for example), and search enige bots, get all the content at the same time too, as does someone with a browser that doesn't support CSS. For the aural browser you could setup a specific style sheet. The search eninge might think that you're spamming your keywords, so be careful about how you implement the double content. </quote> Signature,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------. | weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html | | webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html | |zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html | `-------------------------------------------------- --<--@ ------------' [...] > >> <URL:http://home.wanadoo.nl/b.de.zoete/_test/tooltips_with_markup_and_css.h > >> tml> [quoted text clipped - 6 lines] > <quote> > Keep in mind that in a text browser all is visible at once [...] My apologies. I only looked at your method and ignored the content... SignatureSander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/> >[...] > [quoted text clipped - 3 lines] >> >> <URL:http://home.wanadoo.nl/b.de.zoete/_test/tooltips_with_markup_and_css.html> Ouch! That has a rather nasty accident in Opera 7.23. Must try Opera 8 sometime ... >This sort of thing of course looks very appealing at first sight, but in >the end CSS-dependancy never is a good idea. Just think of how this [quoted text clipped - 8 lines] > >Instead of "Let's see how one can create a tooltip with markup and CSS ." Good point. I frequently disable styling in Opera to cope with microfonts, horrible colour schemes etc. (Not that I'm suggesting it's ever necessary with Barbara's pages.) And while ingenious, it's awfully complex. Here's a suggestion that someone with more time available than me in the next few days might like to try: - put the tooltips in DIVs at the bottom of the page, with display:none; - position and display them with Javascript (onmouseover / onmouseout) for the circa 80% of users with Javascript; - provide a title which is removed by the Javascript for those people with no Javascript but with title display. Will work for most graphical browsers I think, is more acceptable for text browsers, and also makes the tooltop text available to search engines (should that be important). I have to admit I seem to have wandered off-topic though ... SignatureStephen Poley http://www.xs4all.nl/~sbpoley/webmatters/ In article <ia2bo19qjrfr824qm0php51ij5v4mhfquk@news.spartanicus.utvinternet.ie>, [...] > I'd suggest that there is a reason why "tooltip" pop ups disappear after > a certain time, they obscure/cover part of the display. If a user needs > more time to read the content you should ask yourself if you are using > the title attribute and its content appropriately. It is not written in stone that such content must be presented through tooltips. Not every system even has a concept like tooltips available. An alternative for instance could be to render such content in the status bar, which has the advantage of not obscuring page content. In other words, I think this a browser issue, not something Web publishers should adjust their content/markup to. SignatureSander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/> >In article ><ia2bo19qjrfr824qm0php51ij5v4mhfquk@news.spartanicus.utvinternet.ie>, [quoted text clipped - 8 lines] >It is not written in stone that such content must be presented through >tooltips. Not every system even has a concept like tooltips available. That point was made already, but you snipped it: >No such thing, a visual browser may display title content in a pop up >box, but it may also (be configured to) do nothing with it. Nowt to do >with a particular OS. SignatureSpartanicus In article <rj5go19oe2jfn9vm3flbemfvni63k97hhh@news.spartanicus.utvinternet.ie>, [...] > >It is not written in stone that such content must be presented through > >tooltips. Not every system even has a concept like tooltips available. [quoted text clipped - 4 lines] > >box, but it may also (be configured to) do nothing with it. Nowt to do > >with a particular OS. That's not the same point. It suggests this is a "tooltips or nothing" situation, which would support the "if 5 seconds is too short to read a TITLE attribute you shouldn't be using TITLE" argument, which I disagree with. My point was that browsers might render TITLE in *different* ways and that I see no good reason for authors to author for any of those ways specifically. It's up to the browser to provide convenient access to content, including TITLE attributes. If a user doesn't like content-hiding, too-quickly-disappearing tooltips, the problem is with the browser, not the site. SignatureSander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/> >> >It is not written in stone that such content must be presented through >> >tooltips. Not every system even has a concept like tooltips available. [quoted text clipped - 7 lines] >That's not the same point. It suggests this is a "tooltips or nothing" >situation A double "may" indicates that it's not a choice between the 2 listed options. SignatureSpartanicus |
Reply to this Message |
 Sign In
 Join
 My Latest Posts My Monitored Threads My Blog My Photo Gallery My Profile My Homepage Start New Thread Enable EMail Alerts Rate this Thread
|
©2009 Advenet LLC Privacy Policy - Terms of Use
This website includes both content owned or controlled by Advenet as well as content owned or controlled by third parties.