Home > Web Front-end > JS Tutorial > jquery.cvtooltip.js Bubble tip plug-in based on jquery_jquery

jquery.cvtooltip.js Bubble tip plug-in based on jquery_jquery

WBOY
Release: 2016-05-16 18:15:59
Original
1006 people have browsed it
Preface
1. The cv in the plug-in name cvtooltip is the abbreviation of ChinaValue, and tooltip is the prompt.
2. Prompts suitable for new functions, prompts to guide users, prompts for instant messages, prompts for operation failure (no one will stop the operation if it is successful), etc., etc., are implemented using css and do not come with any image files.
3. The problem found so far is that Chrome does not perform well in Chrome. It is because Chrome parses the page differently from IE and FF, resulting in jquery’s position or offset return value being different.
4. This plug-in is still a work of practice. It is a one-person effort and mistakes are inevitable.

Example demonstration
1. While the page is loading, the bubble prompt is also displayed. Please move your attention to the first paragraph.
2. After clicking the button, a bubble prompt will be displayed. Note that the prompt cannot be closed and will automatically disappear after two seconds. I am a link
3. Call the closing function after closing the bubble action. Click me again

Parameters
panel: "body", //This parameter is a container for loading bubble prompts. Different values ​​may result in different calculated positions
selector: "", //Control used to calculate positioning
direction: 0, //arrow direction
width: 300, //bubble prompt width, completely manually set
left: 0, //distance panel parameter The left margin
top: 0, //The distance from the top margin of the panel parameter
delay: -1, //Delay shutdown in milliseconds, a value of 0 means immediate shutdown
speed: 300, // Effect when closing, fade-out speed
close: true, //Whether to display the close button
callback: function() {
$.noop(); //Event after clicking close
}

Usage and source code
I won’t post this. Just check the source file of the page. It is also written very clearly in JS, or click here to download.

Pinais
The premise for displaying bubble prompts is that there must be an object to be prompted. The default position is calculated based on the body. The disadvantage of this is that if the page The content has changed, but the position of the bubble has not, causing the purpose of the prompt to fail.
In response to this situation, the selector parameter is provided to ensure that the bubble changes as the position of the selector control changes.
js file package download
Original address http://www.cnblogs.com/0417/archive/2010/11/17/1880293.html
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template