jquery poshytip訊息提示外掛程式使用

2021-07-04 11:57:13 字數 3238 閱讀 1626

poshy tip是一款非常友好的資訊提示工具了,如我們通常在做表單驗證時會用到這個功能,這樣可以告訴使用者我們是要如何填寫或者什麼東西填寫錯誤了,下面來看看這個poshytip使用。

使用步驟:

注意:資料夾中包含所有樣式,只需引自己需要的樣式,此處引用的是tip-yellow.css。poshytip是基於jquery的外掛程式,所以在引用外掛程式之前先引用jquery,版本需要在1.4+。poshytip包含兩個js檔案jquery.poshytip.js和jquery.poshytip.min.js,前者是未壓縮版,如果在開發中出現錯誤可以引用這個除錯,開發完之後線上引用後者壓縮版的。

2、html及呼叫:

如果沒有設定poshytip的content,那麼它就會將元素的title值作為提示資訊。

設定不同**的提示框

$('#demo').poshytip();

設定classname值來定義**,預設狀態是tip-yellow。取值:tip-yellow,tip-violet,tip-darkgray,tip-skyblue,tip-yellow******,tip-twitter,tip-green

注意:設定classname同時應將對應的css檔案引入。

$('#demo-form-name').poshytip();

配置引數:

型別(時間單位為毫秒)

示例content

顯示的內容(預設取值title)

string, dom element, function, jquery

$('#demo').poshytip();

classname

設定提示框的class

string

$('#demo').poshytip();

bgimageframesize

提示框背景的大小

number

$('#demo').poshytip();

showtimeout

延遲顯示時間

number

$('#demo').poshytip();

hidetimeout

延遲消失時間

number

$('#demo').poshytip();

timeonscreen

自動隱藏之前顯示多長時間

number

$('#demo').poshytip();

//當元素獲取到焦點時,提示框顯示1秒之後自動隱藏

showon

觸發何種事件顯示提示框

string('hover', 'focus', 'none')

$('#demo').poshytip();

//當獲取焦點時顯示提示

liveevents

alignto

設定箭頭位置

string('cursor', 'target')

$('#demo').poshytip();

//設定箭頭位置相對於滑鼠位置

alignx

水平對齊相對於滑鼠游標或目標元素

string( 'right', 'center', 'left', 'inner-left', 'inner-right')

$('#demo').poshytip();

aligny

垂直對齊相對於滑鼠游標或目標元素

string( 'bottom', 'center', 'top', 'inner-bottom', 'inner-top')

$('#demo').poshytip();

offsetx

設定提示框橫向偏移

number

$('#demo').poshytip();

offsety

設定提示框縱向偏移

number

$('#demo').poshytip();

keepinviewport

設定提示始終顯示在視窗

boolean

$('#demo').poshytip();

allowtiphover

當滑鼠懸在tip上時,不隱藏tip

boolean

$('#demo').poshytip();

followcursor

提示跟隨游標移動

boolean

$('#demo').poshytip();

fade

使用fade動畫

boolean

$('#demo').poshytip();

slide

使用slide動畫

boolean

$('#demo').poshytip();

slideoffset

slide動畫相抵消

number

$('#demo').poshytip();

showaniduration

顯示動畫時長

number

$('#demo').poshytip();

hideaniduration

隱藏動畫的持續時間

number

$('#demo').poshytip();

refreshaniduration

非同步更新提示時,動畫的持續時間

number

$('#demo').poshytip();

方法:

.poshytip('show') 顯示提示框,前提提示框的alignto引數被設定為'target'

.poshytip('showdelayed', [ timeout ] ) 設定顯示提示框延遲時間

.poshytip('hide') 隱藏提示框

.poshytip('hidedelayed', [ timeout ] ) 設定隱藏提示框延遲時間

.poshytip('update', content, [ dontoverwriteoption ] ) 更新提示框內容

.poshytip('disable') 禁用提示框

.poshytip('enable') 啟用提示框

.poshytip('destroy') 徹底銷毀提示框

小結:提示無處不在,更多的提示才能幫助使用者輕鬆的使用產品,不管是表單註冊提示、錯誤提示等等。希望你能夠喜歡這款提示外掛程式。

矩陣消元 高斯消元

安利一波高斯消元的部落格,內容很詳細。看完這個相信你已經理解了大概,高斯消元求線性方程組,在學習線性代數 大學課程 的時候我們都接觸過。原理是先把執行緒組轉換成矩陣,然後把它等價變換成上三角矩陣,這樣從下到上依次可以求出解集。高斯消元模板 模板題 include define n 205 using...

水平消隱和垂直消隱 複核消隱訊號

電子槍從左到右畫出象素,它每次只能畫一條掃瞄線,畫下一條之前要先回到左邊並做好畫下一條掃瞄線的準備,這之間有一段時間叫做水平消隱 hblank 在畫完全部掃瞄線 行 之後它又回到螢幕左上角準備下一次畫螢幕 幀 這之間的一段時間就是垂直消隱 vblank 電子槍就是在不斷的走 之 字形。復合消隱訊號 ...

高斯消元 浮點高斯消元

浮點數高斯消元 問題描述 給出乙個線性方程組,有n個方程組,m個未知數。解這個線性方程組。輸入格式 第1行 2個整數n和m,n,m 400,且n不一定等於m 接下來n行,每行m 1個整數,表示乙個方程的m個未知數的係數和常數 輸出格式 如果無解,輸出 no solution 如果有唯一解,輸出m行,...