The example in this article tells the jquery hint plug-in qTip2 usage. Share to everyone for your reference, specific as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
$.fn.qtip.defaults = {//page load completes the element prerender:false to create the hint information,//Set the ID for the hint information, if set to Mytooltip//can be passed Ui-tooltip-mytool Tip access to this hint information id:false,//Every time the prompts are deleted to remove the previous hint Overwrite:true,//through the element property creation hint//such as a[title], rename the original title to Oldtitle Su Ppress:true,//content-Related settings content: {//hint info///If only content can be directly contents: "Prompt information"//without the need for content: {text: {"Hint letter" Text:true "}},///hint info using element attributes attr: ' title ',//Ajax plugin Ajax:false, title: {//Hint message header// If only the title can be directly titled: "title" Text:false,////The Close button of the cue message//such as button: "X", Button: "Close"//All can enable the button to turn off buttons : false},//position-related settings position: {///hint info location///The lower right corner of the target element of the hint (at attribute)///The upper left corner of the corresponding message (my property) I: ' Top le Ft ', at: ' Bottom right ',///cue target element, default for selector target:false,//hint information by default added to container container:false,///Make prompt information in specified order The label is visible and will not exceed the boundary viewport:false, adjust: {//Hint information position offset x:0, y:0, Mouse:true, Resize:true, M Ethod: ' Flip Flip '},
Special effects Effect:function (API, POS, viewport) {$ (this). Animate (POS, {duration:200, queue:false
}); },///show the related settings for the hint shows: {///trigger Event Target element//default for selector Target:false,//event name, default for mouse move//click Ev
ENT: ' MouseEnter ',//special effects effect:true,//Delay Display time delay:90,//Hide other prompts solo:false,///Show prompt when page is loaded Ready:false, modal: {//Enable modal dialog box effect On:false,//special effects effect:true, Blur:true, Escape:tr
UE}},//Hide hints Related Settings//references show Hide: {target:false, event: ' MouseLeave ', Effect:true, delay:0,
When set to True, Fixed:false, Inactive:false, leave: ' Window ', distance:false},//style related styles: { Style name classes: ', Widget:false, Width:false, Height:false,//Tip plugin, arrow related set tip: {corner: True, Mimic:false, Width:8, Height:8, Border:true, offset:0}},//related event binding events: {render:nUll, Move:null, Show:null, Hide:null, Toggle:null, Visible:null, Focus:null, blur:null};
More interested readers of jquery-related content can view the site's topics: A summary of Ajax usage in jquery, a summary of jquery table (table) operations tips, a summary of jquery drag-and-drop effects and techniques, a summary of jquery extension techniques, jquery Common Classic Effects Summary "jquery animation and special effects usage Summary", "jquery selector usage Summary" and "jquery common Plug-ins and Usage summary"
I hope this article will help you with the jquery program design.