昨夜、ドイツとポルトガルの間のフォーカスバトルを見ましたか?北京の早朝、ロナウド率いるポルトガルはドイツ0-4ドイツを一掃されました...彼はゴールデングローブ賞、ヨーロッパゴールデンブーツ、ヨーロッパチャンピオンズリーグのチャンピオンの勝者です。ポルトガルのチームで... 9枚の写真C Ronaldoは涙なく泣くことの意味を教えてくれます
コードコピーは次のとおりです。
<Span style = "font-size:14px;"> <!doctype html public " - // w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<title>スクロール画像</title>
<meta http-equiv = "content-type" content = "text/html; charset = utf-8">
<style type = "text/css">
体
{
フォントサイズ:12px;
フォントファミリー:「Microsoft Yahei」、「Microsoft Yahei」、「Simsun」、「Songyi」;
マージン:0px;
パディング:0px;
テキストアライグ:センター;
}
IMG
{
幅:150px;
高さ:150px;
}
.news_root
{
幅:225px;
高さ:134px;
テキストアライグ:左;
マージン:0 Auto;
}
div .news_header
{
幅:243px;
高さ:16px;
垂直アライイン:トップ;
テキストアライグ:左;
フォントサイズ:14px;
パディング:6px;
}
#ScrollContainer
{
幅:345px;
マージン:2px 5px;
オーバーフロー:隠し;
テキストアライグ:左;
}
</style>
</head>
<body>
<div>
<div> royceは泣きません、</div>
<div id = "scrollcontainer">
<div id = "scrollcontent">
<表>
<tr align = "middle">
<td id = "firstCol">
<表>
<tr>
<td> <img src = "c1.jpg"> </td>
<td> <img src = "c2.jpg"> </td>
<td> <img src = "c3.jpg"> </td>
<td> <img src = "c4.jpg"> </td>
<td> <img src = "c5.jpg"> </td>
<td> <img src = "c6.jpg"> </td>
<td> <img src = "c7.jpg"> </td>
<td> <img src = "c8.jpg"> </td>
<td> <img src = "c9.jpg"> </td>
</tr>
</table>
</td>
<td id = "lastcol"> </td>
</tr>
</table>
</div>
</div>
</div>
<script type = "text/javascript">
var stopscroll = false;
var scrollcontheight = 155;
var ScrollContWidth = 300;
var scrollspeed = 25;
var scrollcontainer = document.getElementById( 'ScrollContainer');
var scrollContent = document.getElementById( 'ScrollContent');
var firstCol = document.getElementById( 'firstCol');
var lastcol = document.getElementById( 'lastCol');
//最初の列のコンテンツを2番目の列にコピーして、スクロールが連続的に見えるようにします
lastcol.innerhtml = firstCol.innerhtml;
scrollcontainer.style.width = scrollcontwidth+"px";
scrollcontainer.style.height = scrollcontheight+"px";
scrollcontainer.nowrap = true;
scrollcontainer.onmouseover = new function( "stopscroll = true;");
scrollcontainer.onmouseout = new function( "stopscroll = false;");
関数init()
{
scrollcontainer.scrollleft = 0;
setInterval(scrollleft1、scrollspeed);
}
init();
var currleft = 0;
functionscrollleft1()
{
if(stopscroll == true)return;
Currleft = ScrollContainer.scrollleft;
scrollcontainer.scrollleft += 1;
if(curleft == scrollcontainer.scrollleft)
{
scrollcontainer.scrollleft = 0;
scrollcontainer.scrollleft += 1;
}
}
</script>
</body>
</html> </span>
ソースコードのダウンロード