joomla-like image scroll

serkan sendur 0 763 Views

very cute and short image scroll script.

<!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>
</head>
<body>
    <div id="someID" style="width: 400px; height: 220px; overflow: auto;">
        <table>
            <tr id="row">
                <td>
                    1<img src="box_yootoppanel.png" /></td>
                <td>
                    2<img src="box_yootoppanel.png" /></td>
                <td>
                    3<img src="box_yootoppanel.png" /></td>
                <td>
                    4<img src="box_yootoppanel.png" /></td>
                <td>
                    5<img src="box_yootoppanel.png" /></td>
                <td>
                    6<img src="box_yootoppanel.png" /></td>
                <td>
                    7<img src="box_yootoppanel.png" /></td>
                <td>
                    8<img src="box_yootoppanel.png" /></td>
                <td>
                    9<img src="box_yootoppanel.png" /></td>
                <td>
                    10<img src="box_yootoppanel.png" /></td>
                <td>
                    11<img src="box_yootoppanel.png" /></td>
                <td>
                    12<img src="box_yootoppanel.png" /></td>
            </tr>
        </table>
    </div>

    <script type="text/javascript">
     var td = row.firstChild;
     function animate() {

         someID.scrollLeft = td.offsetLeft;
         if (td == row.lastChild)
             td = row.firstChild;
             else
                 td = td.nextSibling;
             setTimeout("animate()", 1000);
         }
         animate();
    </script>

</body>
</html>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Edit Preview