最近要實現一個滾動新聞效果,在網上查了一些資料,發現基本的實現方法有兩種:
1.使用Marquee標籤。 這個標籤的使用我已經轉載了一篇比較詳細的文章,這個標籤的優點是便於使用,缺點是人們已經逐漸不適用它了,許多瀏覽器不支持,甚至在IE8想, XHTML4.0的loose.dtd是可以的,而去掉loose.dtd卻不行。
2.使用div javascript的方法。 這種方法的好處是可以相容於幾乎所有的瀏覽器,並且在可以預料的時間內仍能穩定運作。而使用div使得網頁可以利用現有的css資源來實現許多炫目的效果。缺點是需要一定的程式設計經驗和耐心。
使用javascript div方式的基本原理是一樣的,利用scrollTop屬性和offsetheight屬性來實現移動效果。一般使用兩個div,裡面的內容是一樣的,然後利用兩個div拼接,形成不斷循環的效果。以下是我找到的兩份範例程式碼,第一份正是我用的程式碼,可以運行。第二份我沒做測試。寫出來是為了做個對比,第二份應該是能用的,因為那是我從網站上摘下來的。
第一份代號
<%
ArrayList announceList = DBTools.getView("select * from sys_announce order by pubdate DESC");
for (int i = 1; i < announceList.size() && i < 5; i++) {
String announceArr[] = (String[]) announceList.get(i);
String content = announceArr[1];
String date = announceArr[2].substring(announceArr[2].indexOf("-")+1, announceArr[2].indexOf(" "));
%>
 |
<%=content%> <%=date%> |
|
<%
}
%>
第二份程式碼
複製程式碼
程式碼如下:
作者最新文章
-
2024-10-22 09:46:29
-
2024-10-13 13:53:41
-
2024-10-12 12:15:51
-
2024-10-11 22:47:31
-
2024-10-11 19:36:51
-
2024-10-11 15:50:41
-
2024-10-11 15:07:41
-
2024-10-11 14:21:21
-
2024-10-11 12:59:11
-
2024-10-11 12:17:31