中文字幕理论片,69视频免费在线观看,亚洲成人app,国产1级毛片,刘涛最大尺度戏视频,欧美亚洲美女视频,2021韩国美女仙女屋vip视频

打開APP
userphoto
未登錄

開通VIP,暢享免費電子書等14項超值服

開通VIP
jQuery Mobile十大常用技巧

在本文中,將介紹使用jQuery Mobile開發(fā)的一些常用的技巧,閱讀對象為已經(jīng)使用過jQuery Mobile進(jìn)行開發(fā)的移動Web開發(fā)者。

1、禁止截斷過長的列表和按鈕內(nèi)容

在jQuery mobile中,如果列表或者按鈕中文字的內(nèi)容過長,jQuery Mobile會自動截斷其超過長度的內(nèi)容,但如果不希望這樣的話,可以在CSS樣式中增加如下設(shè)置即可,比如下面的是針對按鈕的CSS樣式設(shè)置:

  1. .ui-btn-text {  
  2. white-space: normal;  

下面的是針對列表的CSS樣式設(shè)置 

  1.  .ui-li-desc {  
  2. white-space: normal;  
  3. }  

如果要恢復(fù)對文字的截斷,則繼續(xù)設(shè)置CSS為white-space: nowrap;

2、實現(xiàn)頁面加載時的隨機頁面背景過渡效果

jQuery Mobile中,當(dāng)需要實現(xiàn)頁面加載時,可以有很多的頁面加載事件可供使用。比如下面的CSS和JavaScript代碼,可以實現(xiàn)頁面加載時的隨機頁面背景過渡效果。

CSS代碼: 

  1.  my-page  { background: transparent url(../images/bg.jpg) 0 0 no-repeat; }  
  2.    
  3. .my-page.bg1 { background: transparent url(../images/bg-1.jpg) 0 0 no-repeat; }  
  4.    
  5. .my-page.bg2 { background: transparent url(../images/bg-2.jpg) 0 0 no-repeat; }  
  6.    
  7. .my-page.bg3 { background: transparent url(../images/bg-3.jpg) 0 0 no-repeat; }  

 Javascript代碼:

  1. $('.my-page').live("pagecreate", function() {  
  2.  var randombg = Math.floor(Math.random()*4); //獲得0到3之間的隨機數(shù)  
  3.      $('.my-page').removeClass().addClass('bg' + randombg);  
  4. });  

3、禁用button

在有的情況下,可能會需要禁止按鈕的加載事件,這個時候可以繼續(xù)通過如下的設(shè)置實現(xiàn):

  1. $('#home-button').button("disable");  

如果要恢復(fù)可用,則設(shè)置為:

  1.  $('#home-button').button("enable");  

4、去掉頁面加載時的提示信息

如果在加載頁面時,不需要顯示頁面加載信息時,可以通過設(shè)置一個屬性來取消顯示加載提示信息,如下: 

  1.  $.mobile.pageLoading(true); 

如果要繼續(xù)保持顯示頁面加載信息,則為:

  1.  $.mobile.pageLoading(); 

5、創(chuàng)建自定義主題

jQuery Mobile本身提供了A-E五種不同的主題,但可以自定義主題,步驟如下:

  1. 從jQuery Mobile的任意一個定義主題的CSS文件中,復(fù)制其內(nèi)容到自己定義的CSS文件中。
  2. 給要自定義的CSS主題一個恰當(dāng)?shù)拿Q并且重新命名CSS文件,注意命名必須是(a-z)英文字母,比如你是從jQuery Mobile的主題c的樣式文件中復(fù)制的,則可以將主題命名為Z,則復(fù)制過來的內(nèi)容中,比如要將.ui-btn-up-c改為.ui-btn-up-z,.ui-body-c改為.ui-body-z,如此類推。
  3. 改變新建立的自定義主題的顏色和CSS文件。
  4. 最后,需要在頁面中,應(yīng)用新定義的主題樣式,如下:
    1.  <div data-role="page" data-theme="z"></div> 

6、使用自定義字體

在移動Web應(yīng)用中,有的時候需要更換字體,這樣的話,可以通過使用@font-face方法實現(xiàn),并且性能是十分好的。具體關(guān)于@font-face的使用,請參考

9、移除項目列表中的箭頭

默認(rèn)情況下,jQuery Mobile框架會為每一個列表項添加一個箭頭,想要禁用箭頭顯示,需要在想要移除列表項設(shè)置data-icon="false"。

  1. <li data-icon="false"><a href="contact.html">Contact Us</a></li>  

10、設(shè)置頁面的背景顏色

怎樣在不修改jQuery Mobile樣式下設(shè)置一個頁面背景顏色的?聽起來很簡單,其實需要花幾分鐘時間才能解決。通常情況下,需要在body元素中設(shè)置背景顏色,但是用jQuery Mobile框架,需要設(shè)置在ui-page類中。

  1. .ui-page{  
  2.      background:#eee;  

【編輯推薦】

【責(zé)任編輯:立方 TEL:(010)68476606】

本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點擊舉報。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
jQuery Mobile panel的相關(guān)屬性
HTML5+JS手機web開發(fā)之jQuery Mobile初涉
如何開始一個模塊化可擴展的Web App
SAP UI5 應(yīng)用的標(biāo)準(zhǔn) Theme 和自定義 Theme 的加載討論
十大前端開發(fā)框架
jQuery Mobile的API默認(rèn)配置
更多類似文章 >>
生活服務(wù)
熱點新聞
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點擊這里聯(lián)系客服!

聯(lián)系客服