Click here to Skip to main content
15,885,917 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I am using a repeater control with ul and li for holding data and jquery.li.scroller for scrolling, the problem is soon after all the list items scroll over the screen horizontally, empty space is seen with a width equals screen width, how to remove that empty space and iterate the list items without gap/empty space


I am using
* liScroll 1.0
* Version: 1.0.2.1 (22-APRIL-2011)

any suggestion is appreciated.
Posted
Updated 8-Feb-13 2:23am
v2

go through following link...study it as demo ....try to implement in ur code...
http://rajeshssingh.blogspot.in/2009/10/remove-gap-between-marquee-tags.html[^]
and also u have add body tag in this code when u implement for study.....because it is not contain body tag...also do some required changes...
 
Share this answer
 
v3
also try this code....
.aspx file as follow

ASP.NET
<head runat="server">
   <title>continuous scrolling images</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
body {
     background-image:url(images/bodyBg.jpg);
     background-color:#006;
 }
#container {
     position:relative;
     width:424px;
     height:106px;
     overflow:hidden;
     border:5px double #000;
     background-color:#fff;
     margin:100px auto 0 auto;
 }
#div1 {
     position:absolute;
     left:0px;
     top:0px;
     width:424px;
     height:106px;
 }
#div2 {
     position:absolute;
     left:424px;
     top:0px;
     width:424px;
     height:106px;
 }
img {
     border:1px solid #000;
     margin:2px;
     float:left;
 }
</style>

<script type="text/javascript">
  var m=0;
  var n=424;
  var speed=20;
function scrollPics() {
     document.getElementById('div1').style.left=m+'px';
   m--;
   n--;
if(m==-424) {
   m=0;
 }
if(n==-424) {
   n=424;
 }
setTimeout('scrollPics()',speed);
 } 
window.onload=function() {
   scrollPics();
 }
</script>

</meta></head>
<body>

<div id="container">

<div id="div1">

<asp:datalist id="dtlist" runat="server" repeatcolumns="8" cellpadding="5" xmlns:asp="#unknown">
<itemtemplate>
<div><asp:hyperlink id="HyperLink1" class="preview" tooltip="<%#Bind("Name") %>" navigateurl="<%# Bind("Name", "~/Images/{0}") %>" runat="server">
<asp:image width="100" id="Image1" imageurl="<%# Bind("Name", "~/Images/{0}") %>" runat="server" />
</asp:hyperlink></div>
</itemtemplate>
<itemstyle bordercolor="Brown" borderstyle="Solid" borderwidth="3px" horizontalalign="Center">
VerticalAlign="Bottom" />
</itemstyle></asp:datalist>
</div>


</div>

</body>



.................
in .cs file bind datalist or ur repeater control...
 
Share this answer
 
Comments
[no name] 8-Feb-13 23:24pm    
thank u, let me give a try

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900