Please login or register.

Login with username, password and session length

Author Topic: Visually mark External Links using CSS  (Read 19783 times)

jlhaslip

  • Sr. Member
  • ****
  • Karma: 16
  • Posts: 391
    • My snews with AEF Forum site
Visually mark External Links using CSS
« on: February 19, 2009, 08:18:43 AM »

Wrote a quick Demo about using modern Browsers and CSS to identify links on your page using only CSS.

They Demo is some place near here

Enjoy.
Logged
Yes! I have no siggy.

toxicityj

  • Newbie
  • *
  • Karma: 0
  • Posts: 7
    • jdduenas
Re: Visually mark External Links using CSS
« Reply #1 on: February 19, 2009, 03:36:10 PM »

Saved that to my Web Design bookmark folder, I did.

Pretty neat.
Logged

Patric Ahlqvist

  • Nobodys perfect, but Im pretty effing close
  • Administrator
  • ULTIMATE member
  • ******
  • Karma: 65
  • Posts: 4957
  • I'm a self-made man and worships my creator.
    • p-ahlqvist.com
Re: Visually mark External Links using CSS
« Reply #2 on: February 19, 2009, 04:13:36 PM »

Liking this, I do...
« Last Edit: February 20, 2009, 06:55:28 AM by Patric Ahlqvist »
Logged
My sNews site
"It's only dead fish that goes with the flow... "
Updated, online again - Free designs

poppoll

  • Full Member
  • ***
  • Karma: 47
  • Posts: 201
    • Poppoll's sNews playground
Re: Visually mark External Links using CSS
« Reply #3 on: February 20, 2009, 12:12:26 AM »

Quote
Accessibility on the Web includes making the client aware of the links which open a new window or tab.
which open a new window or tab this is not correct!  In the demo the css only adds the arrow.
If you want a neat script go to cssglobe

PP

Logged

jlhaslip

  • Sr. Member
  • ****
  • Karma: 16
  • Posts: 391
    • My snews with AEF Forum site
Re: Visually mark External Links using CSS
« Reply #4 on: February 20, 2009, 06:07:36 AM »

popoll,
Sorry, It was late... I meant opening an External Link and leaving the current site.
The mind gets weary after midnight...

Nice link. That works for a different task. That will force External  Links to open a new window/tab. This is a CSS method to identify those links which open external to the site you are viewing. Subtle difference.
As  well, my solution requires a 'modern' browser that does the targetting as per CSS 2.1 and CSS 3.

IE won't work... as I found out today...
And no plans for it to do so soon...
http://msdn.microsoft.com/en-us/library/cc351024(VS.85).aspx#attributeselectors
« Last Edit: February 20, 2009, 06:52:37 AM by jlhaslip »
Logged
Yes! I have no siggy.

toxicityj

  • Newbie
  • *
  • Karma: 0
  • Posts: 7
    • jdduenas
Re: Visually mark External Links using CSS
« Reply #5 on: February 20, 2009, 07:35:54 PM »

lol I guess I'll add that to my bag of goodies Firefox, Safari, etc. users get to enjoy exclusively. I award my visitors for not being idiots that use IE.
Logged