CODEWITHSUNDEEP
htmltagsanchorembed
Frisby
Frisby

Reputation: 71

Create a Clickable Embed Tag

I am creating an experimental website. The page visitors view has four embedded elements. I would like the user to be able to click on one embed to advance to the next one further down the page. Here is what I tried:

<a href="#2"><embed src="index.html" height="1000px" width="1300px"></a>

<div id="2"><embed src="2.html" height="1000px" width="1300px"></div>

And

<a href="#2"><embed src="index.html" height="1000px" width="1300px"></a>

<embed src="2.html" id="2" height="1000px" width="1300px">

In both cases the link doesn't work. The embed tag can't be clicked on.

Upvotes: 2

Views: 4528

Answers (2)

Frisby
Frisby

Reputation: 71

I discovered the same issue occurs with the object tag and found the solution here: make an html svg object also a clickable link

The embed must be set to pointer-events: none; and the anchor tag must be set to display:inline-block; My final code is:

<style type="text/css">
embed{
     pointer-events: none;
}

a{
    display:inline-block;
}
</style>

and

<a href="#2"><embed src="index.html" id="1"></a>

<embed src="2.html" id="2">

Upvotes: 5

Aylian Craspa
Aylian Craspa

Reputation: 466

the problem is you are using numbers for id it isn't allowed , id consider as variable name so the rules that applied to variable naming applied here also, change id name starting with letter like "id2" then it will work...

<a href="#d">this is the link to d</a>

<div id="d"><embed src="d2.html" height="1000px" width="1300px"></div>

Upvotes: -1

Related Questions