A jquery based picture scene labeling prompts the window effect _jquery

Today to share a picture based on the jquery image of the pop-up window effects, this example is suitable to mark an object in the picture, click on the pop-up details, compatible with 360, FireFox, Chrome, Safari, Opera, Proud tour, Sogou, the window of the world, IE8 and the following browsers are not supported. The effect is very good. The effect is as follows:

The process of implementation.

This example will refer to the jquery and jquery UI libraries, as well as a main.js library of implementations. Need friends can click on the download button download to see.

HTML code section:

Copy Code code as follows:

<div class= "Container" >
<div class= "Labels" >
<a id= "Label1" class= "label" href= "#" >sofa
<p>
A sofa, is an item of furniture designed to seat more than one person, and providing
Support for the back and arms.</p>
<span/></a><a id= "Label2" class= "label" href= "#" >television
<p>
Television (TV) is a telecommunication medium for transmitting and receiving moving
Images that can is monochrome (black-and-white) or colored, with or without accompanying
Sound.</p>
<span/></a><a id= "Label3" class= "label" href= "#" >carpet
<p>
Carpet is a textile floor of a upper layer attached to a backing.</p>
<span/></a><a id= "Label4" class= "label" href= "#" >chair
<p>
Chair is a furniture designed to seat one person, and providing support
For the back and arms.</p>
<span/></a><a id= "Label5" class= "label" href= "Showcase" >http://www.5icool.org/">showcase"
<p>
Showcase is used to Showcase things at home</p>
<span/></a>
</div>
<div class= "description" >
<p>
</p>
<a class= "Close" >X</a></div>
</div>