Re: [問題] 如何自製橫向選單

看板Ajax作者oao54bb (央)時間14年前 (2012/03/06 07:43)推噓1(1推 0噓 3→)

留言4則, 3人參與討論串3/3 (看更多)

首先非常感謝!! 看到有人懂我得意思!! (還畫了圖，簡直感動) 在下已經非常了解意思了，但還有一個小問題，在<div2> 部分由於我的照片是動態來源，我先設總圖片長度，會發生一些問題 http://ppt.cc/6W~y 如圖所以該怎麼讓裝載圖片的捲軸容器，可以隨著資料多寡改變呢？ (就剩這個問題了..) ※ 引述《jack86 (榮)》之銘言： : ※ 引述《oao54bb (央)》之銘言： : : 我有一個動態的相片資料，會根據搜尋結果，則顯示的筆數也不同。 : : 所以，我想做一個橫向選單的元件，來收納這些圖片資料。 : : 希望如下 : : 1. 寬度貼緊螢幕大小 : : 2. 捲軸是依照資料筆數多寡，而改變長度 : : (我之前用jQuery UI，他只能訂好寬度，實在不便...) : : 3. 自行設計捲軸樣式。 : : 不知道有沒有大大們，有相關作法或套件呢? : : 我有找過幾個套件，都好不適用，希望有機會能自己做.. : : 不知道有沒有製作的方法或教學 : ┌─┬────────────┬─┐ : │ │┌─┐┌─┐┌─┐┌─┐│ │ : │ ││ ││ ││ ││ ││ │ : │＜│└─┘└─┘└─┘└─┘│＞│ : │ ├────────────┤ │ : │ │══●═════════│ │ : └─┴────────────┴─┘ : 你說的應該是這東西吧? : 有一個很簡單的方法 : <div1> // 長度100%, overflow:hidden; : <div2> // 長度=所有圖片總長度或多一點點 : <img/> // 所有被選擇的圖片 : </div> : </div> : div2 再搭配 jQuery 的 .animate({marginleft:"距離"},時間); : click "左" 或 "右"　鍵時移動div2可產生圖片列移動效果。 : scrollbar也用jQuery的套件, 每次移動觸發div2事件即可.. : 更簡單的就是, div1 的overflow-x:scroll; overflow-y:hidden; : 不過個人覺得這樣就不那麼美觀~~~ -- Blog http://oao54bb.blogspot.com/ -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 123.240.34.150