Problems with dynamic link creation
in [JavaScript]
|
Prev: FAQ Topic - My element is named myselect[], how do I access it? (2010-04-09)
Next: FAQ Topic - My element is named myselect[], how do I access it?(2010-04-09)
From: Thomas 'PointedEars' Lahn on 9 Apr 2010 07:53 Garrett Smith wrote: > RobG wrote: >> Garrett Smith wrote: >>> GIAM wrote: >>>> GIAM wrote: >>>>> I'm trying to create a dynamic link with javascript. However, I can't >>>>> seem to add the link onto the page (at least I assume that is the >>>>> problem). Here is the function I use: >> [...] >>> There is no good reason to use javascript:; URIs. >> Yes, and where there is no good reason to have a URI, there is no good >> reason to be using an A element at all. In these cases, the usual >> reason an A element is used is because the presence of an href >> attribute hints that the browser should style it as a link, which >> encourages users to click on it. > > An A with an href is also focusable. True, but where there is no hyperlink, a :link-type element should not be used. An INPUT[type=button] or BUTTON element should be used here instead. >> As the href attribute is superfluous to requirements, it should not be >> there at all. The OP should use an appropriate element - say a span, >> div or button - and style to look like something that should be >> clicked on. > > Using a span with a `tabIndex ` will [...] .... be not Valid: <http://www.w3.org/TR/html401/struct/global.html#edef-SPAN> PointedEars -- Anyone who slaps a 'this page is best viewed with Browser X' label on a Web page appears to be yearning for the bad old days, before the Web, when you had very little chance of reading a document written on another computer, another word processor, or another network. -- Tim Berners-Lee
From: Thomas 'PointedEars' Lahn on 9 Apr 2010 08:30 kangax wrote: > RobG wrote: >> kangax wrote: >>> But A element can receive focus, which is usually important for UI >>> controls. SPAN can not receive focus (unless, IIRC, assigned tabIndex >>> property, in a non-standard manner). >> >> Then, as suggested, a button element can be used, which has default >> styling to encourage clicking, more closely represents the >> functionality the OP seems to want, allows focus and tabindex and can >> (in most modern browsers) can have its appearance styled to match a UI >> theme. > > Fair enough, except that styling buttons is painful. For example, I > don't think it's possible to apply "text-decoration: underline" to a > button in FF. It is possible in Iceweasel 3.5.9 for INPUT[type=button] elements with one of the following `display' values: * block * inline-block * list-item * table-cell * table-caption It is also possible with the BUTTON element when you format one of its inline child elements, like SPAN. > And :hover won't work with it in IE6. As with a lot of other elements. > Those are 2 simple things needed to emulate standard anchor > styling/behavior, and both are problematic. It is not a _link_ (you are confusing links and anchors), so there is no reason it needs to work like one. PointedEars -- Use any version of Microsoft Frontpage to create your site. (This won't prevent people from viewing your source, but no one will want to steal it.) -- from <http://www.vortex-webdesign.com/help/hidesource.htm> (404-comp.)
From: kangax on 9 Apr 2010 10:35 On 4/9/10 8:30 AM, Thomas 'PointedEars' Lahn wrote: > kangax wrote: > >> RobG wrote: >>> kangax wrote: >>>> But A element can receive focus, which is usually important for UI >>>> controls. SPAN can not receive focus (unless, IIRC, assigned tabIndex >>>> property, in a non-standard manner). >>> >>> Then, as suggested, a button element can be used, which has default >>> styling to encourage clicking, more closely represents the >>> functionality the OP seems to want, allows focus and tabindex and can >>> (in most modern browsers) can have its appearance styled to match a UI >>> theme. >> >> Fair enough, except that styling buttons is painful. For example, I >> don't think it's possible to apply "text-decoration: underline" to a >> button in FF. > > It is possible in Iceweasel 3.5.9 for INPUT[type=button] elements with one > of the following `display' values: > > * block > * inline-block > * list-item > * table-cell > * table-caption Thanks. I see that text-decoration doesn't apply in Opera (tested 9.0,9.5,9.64,10.50 on Mac OS X) on "display:inline-block" input[type="button"] elements. Nor in Safari 2.x (but does in later versions). But there's nothing surprising about form controls being difficult to style. This has always been the case. > > It is also possible with the BUTTON element when you format one of its > inline child elements, like SPAN. That's a much better option, yes. [...] >> Those are 2 simple things needed to emulate standard anchor >> styling/behavior, and both are problematic. > > It is not a _link_ (you are confusing links and anchors), so there is no > reason it needs to work like one. Link? Where did I say link? I'm talking about creating UI control that's supposed to look like a standard anchor, and partially behave like one (i.e. change presentation in hover/focus/active states). -- kangax
From: Thomas 'PointedEars' Lahn on 9 Apr 2010 11:37 kangax wrote: > Thomas 'PointedEars' Lahn wrote: >> It is also possible with the BUTTON element when you format one of its >> inline child elements, like SPAN. > > That's a much better option, yes. Depends. The BUTTON element needs to be supported then. >>> Those are 2 simple things needed to emulate standard anchor >>> styling/behavior, and both are problematic. >> It is not a _link_ (you are confusing links and anchors), so there is no >> reason it needs to work like one. > > Link? Where did I say link? You did not, but meant it, and that is the problem. > I'm talking about creating UI control that's supposed to look like a > standard anchor, An anchor is not supposed to look like anything. You want to get informed what an anchor is, and what a (hyper)link is. (Semantically it makes no sense that both links and anchors are created with the same element type. Perhaps TBL thought that this would make the connection between link and anchor better understandable; however, it has in fact caused more trouble than it is worth: you cannot use a standalone `a' CSS element selector to only style textual hyperlinks, and you cannot nest anchors and links in HTML.) However, when something looks like a link that is none, an important rule of UI design has been violated. The *affordance* of an item should be clear: when it looks like a link it should cause navigation like a link; when it looks like a button it should cause an action like a button. > and partially behave like one (i.e. change presentation in > hover/focus/active states). But that is not necessary. PointedEars -- realism: HTML 4.01 Strict evangelism: XHTML 1.0 Strict madness: XHTML 1.1 as application/xhtml+xml -- Bjoern Hoehrmann
From: Garrett Smith on 9 Apr 2010 17:30
Thomas 'PointedEars' Lahn wrote: > Garrett Smith wrote: > >> RobG wrote: >>> Garrett Smith wrote: >>>> GIAM wrote: >>>>> GIAM wrote: [...] >> Using a span with a `tabIndex ` will [...] > > ... be not Valid: > > <http://www.w3.org/TR/html401/struct/global.html#edef-SPAN> For HTML 4, there is no tabIndex on the SPAN. However, keep in mind that this is about "dynamic link creation"; the use of a `tabIndex` property I suggested is not an HTML attribute. -- Garrett comp.lang.javascript FAQ: http://jibbering.com/faq/ |