作者chrisQQ (ＣｈｒｉｓＬｉｕ)
看板Web_Design
标题Re: 请问有关这个图片选单如何做...谢谢
时间Mon Dec 10 19:20:16 2007
※ 引述《OCG (空白)》之铭言：
一开始我先直接找 YUI 的 Example，不过竟然没找到，
（YUI Document：
http://developer.yahoo.com/yui/）
所以就直接从原始码下手。
主要是用了 YNWS.Util.rollingRotateAnim 这个类别
（var YNWS= YAHOO.Tw.News;）
好，废话不多说，
根据原始码，html 的部份你需要
<!--(begin) inc-news_feature_2007.jake -->
<div class="yui-u first">
<div id="ynwsfn" class="ynwsmodule">
<div class="hd"></div>
<div class="bd">
<div class="btn">
<p id="procBtn_ln" class="rollnk">
<a href="#" class="roll1 on"><span>1</span></a>
<a href="#" class="roll2"><span>2</span></a>
<a href="#" class="roll3"><span>3</span></a>
<a href="#" class="roll4"><span>4</span></a>
<a href="#" class="roll5"><span>5</span></a>
</p>
<a href="#" id="lBtn_ln" class="prv"><span>Prev</span></a>
<a href="#" id="rBtn_ln" class="nxt"><span>Next</span></a>
</div>
<p class="title-fn"></p>
<div id="itemContainer_ln" class="viewBox">
<ul id="itemList_ln">
// 第一页面的两张图
// --- Page 1 Begin ---
<li>
<div><table>
<tr>
<th><a href="连结一"><img src="图片一"/></a></th>
<td class="split"></td>
<th><a href="连结二"><img src="图片二"/></a></th>
</tr>
<tr>
<td><a href="连结一">说明一</a></td>
<td class="split"></td>
<td><a href="连结二">说明二</a></td>
</tr>
</table></div>
</li>
// --- Page 1 End ---
// 请依照上面格式复制贴上，做第二个页面的两张图… 以此类推
</ul>
</div>
</div>
</div>
</div>
<!--(end) inc-news_feature_2007.jake -->
js 的部份，刚刚喵了一下，应该是把他吃掉就好
http://tw.yimg.com/i/tw/news/yimg/lsm_news_ext_070606.js
当然必要的 YUI 还是要引入
理论上把 rollingRotateAnim 部份留着就好
那段 code 看起来还好（不过我没有很仔细看啦…）
不知道有没有 API 可以查...
大概是这样～ 他里面一些变数应该可以猜得到。
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 61.62.42.9
1F：推 TonyQ:原ｐｏ是正妹 (逃) 12/10 21:04
2F：→ chrisQQ:楼上... 是猪... 12/10 22:13
3F：推 OCG:感谢美女大大...Q_Q 12/11 01:14
5F：→ mycity:我参考 wxyy大的网页作一个范例 12/13 00:36
7F：→ mycity:-.- 搞定了 12/14 00:28