/    Sign up×
Community /Pin to ProfileBookmark

Advanced link areas

Copy linkTweet thisAlerts:
Oct 25.2003

Hello,
I’m quite familiar with using <map> and <area> tags when creating my links. You define the coordinates for the area to begin, and the coordinates for where it ends. Then an invisible, square box is created around it so that you can click on that area. But that’s not the thing.

I.e. at [URL=http://www.imesh.com]Imesh[/URL]‘s homepage, you can see a ROUND area. At the “click here button”. What I am wondering is: How can I create a ROUND area like this in HTML?

I know my message sounds confusing, but plz give it a shot, I really need help on this 1.

to post a comment
HTML

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@CharlesOct 25.2003 — [font=georgia]Use the "shape" attribute with the AREA element. Seehttp://www.w3.org/TR/html4/struct/objects.html#h-13.6.1.[/font]
Copy linkTweet thisAlerts:
@LotusauthorOct 25.2003 — Thx, that helped a lot ?

Buut...

<area href="default.html" shape="square" coords="1,1,2,2">

Let's say this is my piece of code.

I understand this, ok?

x start,y start,x end,y end

Dum-dum:

<area href="default.html" shape="circle" coords="1,1,20">

This is the piece of code i want to use, since my form is supposed to be a circle. I don't get it.

Because as you can see, it has one attribute less than the square.

What is those three attributes for the circular shape then?
Copy linkTweet thisAlerts:
@CharlesOct 25.2003 — [i]From the HTML 4.01 Specification:[/i]

[b]coords = coordinates[/b] [CN]

This attribute specifies the position and shape on the screen. The number and order of values depends on the shape being defined. Possible combinations:

  • * rect: left-x, top-y, right-x, bottom-y.


  • * circle: center-x, center-y, radius. Note. When the radius value is a percentage value, user agents should calculate the final radius value based on the associated object's width and height. The radius should be the smaller value of the two.


  • * poly: x1, y1, x2, y2, ..., xN, yN. The first x and y coordinate pair and the last should be the same to close the polygon. When these coordinate values are not the same, user agents should infer an additional coordinate pair to close the polygon.

    [i]http://www.w3.org/TR/html4/struct/objects.html#h-13.6.1[/i]
    • [/quote]
    ×

    Success!

    Help @Lotus spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 — BETA 5.29,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,

    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,
    )...