• <td id="ceeca"><noscript id="ceeca"></noscript></td>
  • <td id="ceeca"></td>
  • <bdo id="ceeca"><center id="ceeca"></center></bdo>
    您的位置:首頁 > PPT課件 > 培訓教程PPT > jquerymobile培訓ppt課件

    jquerymobile培訓ppt課件

    素材編號:
    483884
    素材軟件:
    PowerPoint
    素材格式:
    ZIP/RAR
    素材上傳:
    weishenhe
    上傳時間:
    2022-10-09
    素材大。
    1.77 MB
    素材類別:
    培訓教程PPT
    網友評分:

    素材預覽

    jquerymobile培訓ppt課件

    jquerymobile培訓ppt課件下載是由PPT寶藏(www.xpj338811.com)會員weishenhe上傳推薦的培訓教程PPT, 更新時間為2022-10-09,素材編號483884。

    這是jquerymobile培訓ppt課件下載,主要介紹了瀏覽器支持;頁面切換效果應用條件;使用data-transition 屬性后可用的頁面切換效果;data-direction 屬性的reverse值;實例制作;jQuery Mobile 按鈕;工具欄;導航欄;可折疊塊,jQuery Mobile 提供了各種頁面切換到下一個頁面的效果。歡迎點擊下載jquerymobile培訓ppt課件。

      一.jQueryMobile頁面切換效果

      1.瀏覽器支持2.頁面切換效果應用條件3.使用data-transition屬性后可用的頁面切換效果4.data-direction屬性的reverse值5.實例制作

      頁面切換效果可被應用于任何使用data-transition屬性的鏈接或表單提交:切換到第二個頁面

      2.頁面切換效果應用條件

      3.使用data-transition屬性后可用的頁面切換效果

      在jQueryMobile的所有鏈接上,默認使用淡入淡出的效果(如果瀏覽器支持)。

      4.data-direction屬性的reverse值

      提示:上面的所有效果支持后退行為。例如,如果您想要頁面從左向右滑動,而不是從右向左滑動,請使用帶有"reverse"值的data-direction屬性。在后退按鈕上這是默認的。

      5.實例制作

      實例:切換請參照下邊兩個效果圖完成頁面制作(實例文件夾中的1.html):

      頁面1效果圖頁面2效果圖

      二.jQueryMobile按鈕

      1.在jQueryMobile中創建按鈕2.導航按鈕3.內聯按鈕4.組合按鈕5.后退按鈕6.jQueryMobile按鈕圖標

      1.在jQueryMobile中創建按鈕

      在jQueryMobile中,按鈕可通過三種方式創建:使用元素

     

      (1)使用

     

    請參照下邊效果圖完成頁面制作:

      (2)使用元素創建按鈕

      創建方法:請參照下邊效果圖完成頁面制作:

      (3)使用元素創建按鈕

      創建方法:按鈕請參照下邊效果圖完成頁面制作:

      (3)使用元素創建按鈕

      在jQueryMobile中,按鈕會自動樣式化,讓它們在移動設備上更具吸引力和可用性。我們推薦您使用帶有data-role="button"的元素在頁面間進行鏈接,使用元素進行表單提交。

     

      2.導航按鈕

      如需通過按鈕在頁面間進行鏈接,請使用帶有data-role=“button”屬性的元素如:問第二個頁面

      效果圖1效果圖2

      3.內聯按鈕

      默認情況下,按鈕占滿整個屏幕寬度。如果你想要一個僅是與內容一樣寬的按鈕,或者如果您想要并排顯示兩個或多個按鈕,請添加data-inline=“true”。方法如下:問第二個頁面

      3.內聯按鈕

      請參照下邊兩個效果圖完成頁面制作(實例文件夾中的3.html):

      效果圖1效果圖2

      4.組合按鈕

      jQueryMobile提供了一個簡單的方法來將按鈕組合在一起。data-role=“controlgroup”屬性和data-type=“horizontal|vertical”一起使用來規定是否水平或垂直組合按鈕。默認情況下,組合按鈕是垂直組合,它們之間沒有外邊距和空間。并且只有第一個和最后一個按鈕是圓角,以便它們組合在一起的時候創建一個漂亮的外觀。

      4.組合按鈕

      實例按鈕1按鈕2按鈕3

      4.組合按鈕

      請參照下邊兩個效果圖完成頁面制作(實例文件夾中的4.html):

      data-role="controlgroup"data-type="horizontal|vertical“實例:按鈕1按鈕2按鈕3

      5.后退按鈕

      如需創建后退按鈕,請使用data-rel="back"屬性(這會忽略錨的href值):實例返回

      5.后退按鈕

      請參照下邊兩個效果圖完成頁面制作(實例文件夾中的5.html):

      5.后退按鈕

      更多用于按鈕的data-*屬性

      data-corners見實例文件夾中的6.htmldata-mini見實例文件夾中的7.htmldata-shadow見實例文件夾中的8.html

      6.jQueryMobile按鈕圖標

      jQueryMobile提供了一套讓按鈕看起來更稱心如意的圖標。

      (1)添加圖標到jQueryMobile按鈕

      如需添加圖標到您的按鈕,請使用data-icon屬性。如:Search提示:您也可以在

     

      下面我們列出一些jQueryMobile提供的可用圖標:

      (2)定位圖標

      您也可以規定圖標定位在按鈕的什么部位:頂部(top)右側(right)底部(bottom)左側(left)默認情況下,所有的按鈕圖標被放置到左側。

      (2)定位圖標

      請使用data-iconpos屬性來指定位置。圖標的位置:頂部右側底部左側

      (3)只顯示圖標

      如果只想顯示圖標,請設置data-iconpos為"notext":后退:搜索見實例文件夾中的9.html

      三.jQueryMobile工具欄

      工具欄元素通常位于頭部和尾部內-讓導航易于問。如圖所示:1.頭部欄2.尾部欄3.定位頭部欄和尾部欄

      1.頭部欄

      頭部欄一般包含頁面標題/logo或一兩個按鈕(通常是首頁、選項或搜索)。您可以添加按鈕到頭部的左側或右側。下面的代碼,將添加一個按鈕到頭部標題文本的左側,添加一個按鈕到頭部標題文本的右側:實例(請制作)首頁

    歡迎來到我的主頁

    搜索

     

    上一頁:駕校理論ppt課件 下一頁:oracle經典入門教程培訓ppt課件

    jquerymobile培訓ppt課件

    下載地址

    jquerymobile培訓ppt課件

    優秀PPT

    Copyright:2009-2019 pptbz.com Corporation,All Rights Reserved PPT寶藏 版權所有

    免責聲明:本網站內容由用戶自行上傳,如權利人發現存在誤傳其他作品情形,請及時與本站聯系

    PPT模板下載 粵ICP備13028522號

    舉報 少妇被粗大的猛烈进出短文
  • <td id="ceeca"><noscript id="ceeca"></noscript></td>
  • <td id="ceeca"></td>
  • <bdo id="ceeca"><center id="ceeca"></center></bdo>