<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html> <head> <link rel="stylesheet" href="../../../codebase/touchui.css" type="text/css" media="screen" charset="utf-8"> <script src="../../../codebase/touchui.js" type="text/javascript" charset="utf-8"></script> <style> html,body{ background-color:#ffffff; } .content{ width:100%;height:100%;background-color:#565656; } </style> <title>Carousel view</title> </head> <body> <script type="text/javascript" charset="utf-8"> dhx.ui({ view:"window", body:{ view:"carousel", id:"carousel", cols:[ { template:img, data:{src:"imgs/image001.jpg"} }, { template:img, data:{src:"imgs/image002.jpg"} }, { template:img, data:{src:"imgs/image003.jpg"} }, { template:img, data:{src:"imgs/image004.jpg"} }, { template:img, data:{src:"imgs/image005.jpg"} }, { template:img, data:{src:"imgs/image006.jpg"} } ], panel:{align:"bottom"} }, head:{ view:"toolbar", type:"MainBar", data:[ {type:"label", label: "Photobook", align:'left'} ] }, top:150, left:150, width:480, height:340 }); function img(obj){ return '<div class="content"><img src="'+obj.src+'" width="462px" height="275px" border="0" style="margin:8px 8px 15px 8px" ondragstart="return false"/></div>' } </script> </body> </html>