New html element: preview

[ghost]

1. Problem

1. There is no specification about preview-links in html
2. As there is no specification, each browser implements a form of link view

2. Solution

It would be interesting to have an html that specifies the previews of the links.

2.1. sample.html

<preview></preview> <!--- mode local preview --->
<preview src="url"></preview> <!--- mode remote preview --->
<a href="" preview="true">Link</a> <!--- reference mode local preview  --->

2.2. sample.html

<preview>
<dialog id="content" class="card" open>
  <p>Misumena vatia is a species of crab spider with a holarctic distribution. In North America, it is called the goldenrod crab spider or flower (crab) spider,[1] as it is commonly found hunting in goldenrod sprays and milkweed plants. They are called crab 
</p>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/eb/Crab_spider_%28Misumena_Vatia%29_with_prey_silver-spotted_skipper_%28Hesperia_comma%29.jpg/350px-Crab_spider_%28Misumena_Vatia%29_with_prey_silver-spotted_skipper_%28Hesperia_comma%29.jpg"/>
</dialog>
</preview>

<div class="container">
<a href="https://en.wikipedia.org/wiki/Misumena_vatia" preview="true">Misumena vatia</a>
, the flower spider, is a species of crab spider found in North America and Europe. Females choose to settle on a flower where they remain stationary, while the much smaller males roam around looking for mates. This female spider was photographed having caught a silver-spotted skipper on a Centaurea jacea flower in Bükk National Park, Hungary.
</div>

3. reference

• https://discourse.wicg.io/t/draft-idea-spec-proposal-link-preview-popup/5871