Announcement

Collapse
No announcement yet.

How to: target _blank xhtml strict compatible

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • How to: target _blank xhtml strict compatible

    You maybe know that you can't validate as xhtml strict a page if you use
    Code:
    <a href="http://www.w3it.org" target="_blank">w3it.org</a>
    the target attribute for the a element in xhtml strict can't be recognized as possible value: in fact the XHTML strict DTD do not include this attribute.
    There is a way in any case to fix the problem and achieve the result, creating a link that will be opened on another browser Page or Tab ( like the target="_blank" do ). The following code reproduce the same effect as the above link where is used the attribute target, but it is XHTML STRICT compatible:
    Code:
    <a href="http://www.w3it.org" onclick="window.open(this.href,'_blank');return false;">w3it.org</a>
    w3it.org in effect, use this tip for any external linked page.

  • #2
    It worked, Thanks

    Comment


    • #3
      Very good work!

      Hehe for lamer like me that want to do xhtml strict pages this kind of things are very very important!

      Comment


      • #4
        Works but isn't the best solution

        It's working but it's not the best solution because if you haven't enabled your JavaScript, this won't work.

        Comment


        • #5
          It is the only i know!

          Solution by axew3 is correct:
          if you haven't enabled your JavaScript, this won't work.
          if javascript is not enabled in the browser, than the link will be opened in the same window or tab.
          So the javascript solution let work correctly the link anyway, not as target _blank if js isn't enabled, but (clearly) like target _self.
          And now so, what's your best solution? I know there aren't more!

          Comment


          • #6
            target=&quot;_blank&quot; css/xhtml replacement

            I have been building a website devoid of any java-script and want to keep it that way. What other meathods can I use to use the: target="_blank" in css or xhtml strict 1.1?

            Comment


            • #7
              CSS 3 the solution for links target blank and validation as DTD strict

              Originally posted by cjelinger View Post
              I have been building a website devoid of any java-script and want to keep it that way. What other meathods can I use to use the: target="_blank" in css or xhtml strict 1.1?
              i think this is the definitive answer:
              If a user wanted to have new windows open in new tabs instead, she could use the following user style sheet to do so:
              Code:
              * { target-new: tab ! important }
              but it is CSS 3, and while we are waiting for compliance of all browsers with the w3 consortium standards CSS3, for what is my experience there is nothing best than the above javascript code (that can be implemented in various ways, also using for example the jquery library).
              CSS3 Hyperlink Presentation Module.
              The CSS 3 will solve all problems about strict DTD validations for web documents. Don't know, and i will check soon, what browsers are compliant with css3, if there are someone; would like to know what about many others standards and directives at the w3c, what's the state of development, what releases, when in case etc...

              Code:
              # target-name: current | root | parent | new | modal | <string>
              # target-new: window | tab | none
              # target-position: above | behind | front | back
              # target: <target-name> || <target-new> || <target-position>
              above
              The new destination tab (window) is placed above the current tab (window) respectively.
              behind
              The new destination tab (window) is placed behind the current tab (window) respectively.
              front
              The new destination tab (window) is placed above all other tabs (windows) respectively.
              back
              The new destination tab (window) is placed behind all other tabs (windows) respectively.
              P.S - more about the problem solving for target _blank and strict validation, there isn't any Apache directive that can be configured to give target blank for all or specifics links, ever for what i know, and i never have think to this in Php, where also i don't think it can be possible without javascript. The fact is that the link is processed by the browser (client side) when you click with your mouse and there is nothing you can do for this in the server side. When browsers will have css3 standards implemented, than we will have many more powerful features in our hand.

              Comment


              • #8
                The Css3 home page at the world wide web Consortium (w3c).

                last added to this post on: 25 Jul 2012
                More precisely, for css3 hyperlinks we should look at:
                CSS3 hyperlinks page

                Comment


                • #9
                  yup

                  IT REALLY WORKS!*


                  *just for you pAvax

                  Comment


                  • #10
                    Thanks!

                    You were the first solution on a google search. Kudos your way ...

                    Comment


                    • #11
                      Thanks for the great tip

                      Originally posted by axew3 View Post
                      Code:
                      <a href="http://www.w3it.org" onclick="window.open(this.href,'_blank');return false;">w3it.org</a>
                      Thanks for the great tip axew3, we're now using it at http://www.myperformancepitstop.com

                      Andrew

                      Comment


                      • #12
                        Or you could...

                        Or you could just use this:

                        [code]<a rel=”external” href='http://www.google.com' />Google</a>[code]

                        Comment


                        • #13
                          Erm...

                          Originally posted by JasonD View Post
                          Or you could just use this:

                          <a rel=”external” href='http://www.google.com' />Google</a>
                          That's probably not a good solution. The W3Schools page ( http://www.w3schools.com/TAGS/att_a_rel.asp ) says it isn't supported in any major browsers.

                          Comment


                          • #14
                            Element Not Allowed

                            Hi,

                            I try to use this:

                            <a href="http://www.w3it.org" onclick="window.open(this .href,'_blank');return false;">w3it.org</a>

                            but in http://validator.w3.org/ have this error:

                            Error Line 366, Column 86: document type does not allow element "a" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "pre", "address", "fieldset", "ins", "del" start-tag

                            ….w3it.org" onclick="window.open(this .href,'_blank');return false;" (> error with this) w3it.org</a>



                            The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

                            One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").


                            Its posible solve this bug?

                            Thanks!!

                            Comment


                            • #15
                              element not allowed: why and solutions

                              I try to use this:

                              <a href="http://www.w3it.org" onclick="window.open(this .href,'_blank');return false;">w3it.org</a>

                              but in http://validator.w3.org/ have this error:

                              Error Line 366, Column 86: document type does not allow element "a" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "pre", "address", "fieldset", "ins", "del" start-tag

                              ….w3it.org" onclick="window.open(this .href,'_blank');return false;" (> error with this) w3it.org</a>

                              The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

                              One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").


                              Its possible solve this bug?
                              SOLUTION:
                              yes! the problem come out due to the reason that the
                              Code:
                              <a href="http://www.w3it.org" onclick="window.open(this .href,'_blank');return false;">w3it.org</a>
                              so the
                              Code:
                              <a>
                              element, need to be nested inside another element, like the tag
                              Code:
                              <ins>
                              ... so to validate, try this:
                              Code:
                              <ins><a href="http://www.w3it.org" onclick="window.open(this .href,'_blank');return false;">w3it.org</a></ins>
                              or just, if the code structure allow this, try this:
                              Code:
                              <p><a href="http://www.w3it.org" onclick="window.open(this .href,'_blank');return false;">w3it.org</a></p>
                              explanation: some html elements, need to be coded inside others (nested) to be validated as xhtml strict or xhtml DTD.

                              Comment

                              Previously entered content was automatically saved. Restore or Discard.
                              Auto-Saved
                              x
                              Insert: Thumbnail Small Medium Large Fullsize Remove  
                              x
                              x
                              Working...
                              X