Toggle main menu visibility
新聞
下載
教材
影音
討論
其他選單
好站連結
行事曆
電子相簿
常見問題
萬用表單
即時留言簿
友站消息
社大學員
:::
登入
登入
帳號
密碼
登入
重整畫面
:::
所有書籍
「[982]PHP網站開發 進階應用技巧」目錄
MarkDown
1-1 index.html
1. 簡易jquery應用
1-1 index.html
2. jquery六大工具(上)
2-1 tabs範例
2-2 tabs AJAX範例
2-3 垂直選單
2-4 水平選單
3. jquery六大工具(下)
4. 即時新增表單欄位
4-1 telbook.php
4-2 電話簿+垂直捲軸
5. 表單驗證
5-1 mem.php
5-2 mem_chk.php
5-3 jquery.validationEngine-tw.js
6. PHP圖表pChart
6-1 demo1.php
7. 月曆功能
7-1 get_event.php(正確完成版,可抓出該月事件)
8. CSV的匯出與匯入
9. 所見即所得編輯器
10. 多檔上傳
10-1 index.php
11. 縮圖及上傳物件
11-1 index.php
12. 製作PDF檔(上)
12-1 pdf.php
12-2 解決Linux下PDF無法秀出中文
13. 製作PDF檔(下)
13-1 pdf.php
14. 線上影像合成
14-1 index.php
14-2 pic.php
15. 圖形認證與計數器
15-1 index.php
15-2 pic.php
15-3 show.php
15-4 counter.php
16. Google Map初探
16-1 index.html
17. 搜尋存取GMap位置
17-1 index.php
18. 憑空生出Excel檔
18-1 12月份工作表
18-2 excel.php
2-1 tabs範例
\[982\]PHP網站開發 進階應用技巧 ===================== [](http://120.115.2.76/tad/tad_book3/file/9802/02.zip) ### 一、jquery六大工具包 1.官方網站:http://flowplayer.org/tools/ 2.底下所有程式都需要加入這幾行: <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript" src="jquery.tools.min.js"></script> ### 二、Tabs標籤包 1.基本架構: --- 放在<head>中 --- <script type="text/javascript"> $(function() { $("ul.tabs").tabs("div.tabs\_content > div"); }); </script> <link rel='stylesheet' type='text/css' href='tabs/tabs.css' /> --- 放在<body>中 --- <!-- 頁籤 --> <ul class="tabs"> <li><a href="#">Tabs 標籤包</a></li> <li><a href="#">ToolTip 提示包</a></li> </ul> <!-- 頁籤對應的內容 --> <div class="tabs\_content"> <div>這是「Tabs 標籤包」要呈現的內容</div> <div>這是「ToolTip 提示包」要呈現的內容</div> </div> --- 2.用 .history() 可以紀錄點選標籤的順序。 3.加入 {event: 'click'} 可指定頁籤牽換方式,如:dblclick、mouseover 4.內建特效包括:default、fade、slide、ajax 及 horizontal
$("ul.tabs").tabs("div.tabs\_content > div", {effect: 'slide'}); $("ul.tabs").tabs("div.tabs\_content > div", {effect: 'fade',fadeInSpeed: '100'});
### 三、ToolTip提示包 --- 放在<head>中 --- <script type="text/javascript"> <script type="text/javascript"> $(function() { $("img\[title\]").tooltip('#demotip'); }); </script> <style> #demotip { display:none; border:1px solid black; font-size:12px; padding:10px; color:#FFFFFF; rgb(102,204,204); } </style> --- 放在<body>中 --- <div id="demotip"> </div> <img src="圖檔" title="這裡就是放說明的地方">
:::
搜尋
search
進階搜尋
QR Code 區塊
快速登入
所有討論區
「PHP全端開發」線上課程討論區
XOOPS使用討論區
一般研習學員
社大學員專用
路過哈啦區
XOOPS佈景設計
XOOPS模組開發
Tad書籍區
即時留言簿
書籍目錄
展開
|
闔起
線上使用者
71
人線上 (
20
人在瀏覽
線上書籍
)
會員: 0
訪客: 71
更多…