Comments (11)
http://www.w3.org/Graphics/SVG/WG/track/actions/3825
from svgwg.
For 1., the HTML spec has an authoring requirement that <a>
elements are not nested, so I think we should do the same.
from svgwg.
Regarding the action, quick testing shows that in HTML the inner link is activated, so again I think we should just require that.
from svgwg.
Think I'm missing some terminology here.
What do you mean by activated? That the inner link is treated as a well formed link and not ignored? That's what I'm seeing, but it seems to contradict making the requirement that not be nested.
from svgwg.
Activated as in when you click it it's that element's href that is navigated to.
from svgwg.
RESOLUTION: the content model of the a element in SVG will allow nested a elements
https://www.w3.org/2016/02/18-svg-minutes.html#item02
Decision based on the following points:
- This is a useful semantic tool and there's no reason to forbid it
- Browsers do support this even though the HTML spec disallows nested a elements so interop already exists
The plan is also to bring the other attributes onto the SVG a element.
from svgwg.
Looking again at @heycam's test. I'm assuming the reason the nested link is inserted by script is because the HTML 5 parser would treat this as an authoring error, and close off the outer link when you start the inner link. So I don't think that should really be used as an example of "it works in HTML, so it should work in SVG".
That said, the HTML 5 parser is much less fussy once it gets to SVG, so if we say it is OK, it's OK. It is definitely useful to be able to define an image map with specific link regions as well as a generic "background" link. (Although that doesn't require nested links, it could be done simply with layering.)
from svgwg.
Test case for SVG links inside links: http://jsbin.com/nidixomute/1/edit?html,output
Variation with focus styles: http://output.jsbin.com/quvuyaxace/1
Currently, Chrome and Safari do not render the content inside the nested link (the orange ellipse is visible, no blue link to the GitHub issue). Firefox, Edge, and Batik Squiggle render the blue ellipse and link it as specified by the nested <a>
; they also have no problem with the tab order (nested link comes after outer link). rSVG and Inkscape also render the blue, although Tav said the nested links seemed to confuse element selection dialogs.
Technically, Chrome & WebKit are correct by SVG 1.1: don't render SVG elements that are in places they don't belong, and don't put a link inside a link. However, given the lack of compatibility, I don't see a problem with making the Firefox/Edge/etc behavior correct for SVG 2.
from svgwg.
On adding attributes: the whole purpose is consistency with HTML, but we already have an existing inconsistency that href
and target
are implemented on SVGAElement as animated strings, so the IDL is of the form linkElement.target.animVal = "_blank"
.
Which means either I introduce the new properties in a way that's inconsistent with HTML (make them also animated string) or inconsistent with the existing properties).
from svgwg.
Closed by 33f85d2
I made the new IDL attributes consistent with the old SVG ones; see #175 for a possible way to address this mess.
I added a "at risk" warning for nested links. I'm worried it could cause problems in the accessible representation.
from svgwg.
Important: The resolution above about "allowing nested links" was revised based on accessibility testing:
#178 (comment)
Current advice (and SVG 2 spec) is that the nested link should render but would not be treated as an actual link.
from svgwg.
Related Issues (20)
- Should SVG's `<image>` element support the `fetchpriority` attribute analogous to HTML's `<img>` element? HOT 1
- Decimal point not allowed according to Path Data ENBF HOT 3
- Enable lazy loading for URLs on use href HOT 1
- Does SVG support Custom elements? HOT 1
- Error about drawto_command in SVG 2.0 path EBNF HOT 2
- What should happen when trying to insert empty strings or separators into SVGStringList
- SVGAElement.prototype.text should be removed HOT 6
- Serialization of transform functions and transform attribute.
- Update UA stylesheet rules to use :any-link instead of :visited or :link HOT 2
- Incorrect description of path horizontal and vertical movement HOT 7
- Publish current status of SVG
- Is the `path()` function allowed for the `d` property? HOT 2
- Can we fix arc interpolation? HOT 4
- Implementing CSS Text Wrapping in SVG HOT 1
- optional
- Arc sweep vs clockwise explanation HOT 1
- incorrect syntax for svg_path in SVG2 draft
- Define path interpolation when relative and absolute segment types are used. HOT 4
- gradient stroke along path direction HOT 1
- Computing the equivalent transform of an SVG viewport
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from svgwg.