1、Spry框架技術,主要內(nèi)容,Spry菜單欄 Spry 選項卡面板 Spry 折疊式 Spry 可折疊面板,什么是Spry框架,Spry 框架是一個 JavaScript 庫，Web 設計人員使用它可以構建能夠向站點訪問者提供更豐富體驗的 Web 頁。有了 Spry，就可以使用 HTML、CSS 和極少量的 JavaScript 將 XML 數(shù)據(jù)合并到 HTML 文檔中，創(chuàng)建構件（如折疊構件和菜單欄、Spry選項卡式面板等），向各種頁面元素中添加不同種類的效果。,Spry菜單欄,1、插入Spry菜單欄 是一組可導航的菜單按鈕，可創(chuàng)建子菜單 方法：插入布局Spry菜單欄 注意（1）插入spry構件

2、前，頁面必須先保存，否則會彈出提示對話框。（2）插入spry菜單后保存頁面，會自動保存生成的js文件和圖片文件到SpryAssets文件夾中,Spry菜單欄,圖示：,保存頁面時彈出,插入Spry菜單欄,實例演示,Spry菜單欄,2、設置菜單欄屬性 選中插入的spry菜單欄屬性面板中設置相關信息,屬性面板中可設置三級菜單，如果要設置更多子菜單，可在代碼中添加,設置菜單欄屬性,實例演示,Spry菜單欄,3、自定義菜單項樣式 （1）禁用菜單樣式 （2）修改自動生成的css文檔代碼,自定義菜單項樣式,實例演示,Spry菜單欄,4、設置菜單項的尺寸 選中菜單欄中的某一個屬性面板中設置,說明：1em指一個

3、字體大小，默認8em，也可在css中修改相應的li的屬性,設置菜單項的尺寸,實例演示,Spry選項卡面板,1、插入Spry選項卡式面板 是一組面板，用來將內(nèi)容放置在緊湊的空間中 方法：插入布局Spry選項卡面板 2、屬性設置 3、自定義樣式 4、面板寬度設置,Spry選項卡面板,實例演示,Spry折疊式面板,1、插入Spry折疊式面板 一級可折疊的面板，用來將大量內(nèi)容放置在緊湊的空間中 方法：插入布局Spry折疊式 2、屬性設置 3、自定義樣式 4、面板寬度設置,Spry折疊式面板,實例演示,Spry可折疊面板,1、插入Spry可折疊式面板 是一個面板，可將頁面內(nèi)容放置于一個緊湊的小空間中 方

4、法：插入布局Spry可折疊面板 2、屬性設置 3、自定義樣式 4、面板寬度設置,Spry可折疊面板,實例演示,實現(xiàn)文字滾動,標簽介紹： （1）Behavior（行為）屬性,設定內(nèi)容的滾動方式。有三個選項：Scroll（滾動）、slide（滑入）、alternate（交替） （2）Direction（方向）屬性：up（向上）down（向下）left（向左）、right（向右） （3）scrolldelay：控制每一次移動的時間間隔，單位為毫秒，數(shù)值越小，移動越快，且更平滑。 （4）scrollamount：控制每一次移動的像素數(shù)，數(shù)值越大，移動越快。,實現(xiàn)文字滾動,例1: 熱烈祝賀十一屆全國人大一次