Click here to Skip to main content
14,486,406 members
Rate this:
Please Sign up or sign in to vote.
Actually i am facing problem of using marquee in asp.net. problem getting in latest googlecrome version.
I developed a functionality to move users left and right in a panel.
first i binded data to datalist and i placed that datalist in morquee tag and i am moving left and right with the help of buttons which are placed left and right of the marquee . now it is working in all versions except new googlecrome version so because of this issue i want to change the marquee control with html5 any control which will solve my problem.

is there any solution for the above functionality?
Posted
Updated 23-Oct-14 20:21pm
v2
Comments
   
Not clear. What is "move users"? And so on...
—SA
ntitish 20-Oct-14 0:48am
   
Sorry for not explaining my question clearly. Actually i am rotating some users with some details in my home page from left to right using datalist placing in between morquee tags u can see below example how i am showing in my page

< < | Harish | Sudheer | Pavan | > >
Left < < | Male | Male | Male | > > right
< < | Age 21+ | Age 22+ | Age 23+| > >
   
Bad idea, I would say... Anyway, it's not clear what's your problem.
—SA
ntitish 20-Oct-14 0:57am
   
k, is there any control which will replace morquee functionality.
ntitish 20-Oct-14 1:00am
   
you can see in the below link at the last of the page they given one example like that i want to bind my users

http://www.c-sharpcorner.com/UploadFile/18ddf7/how-to-get-marquee-feature-without-marquee-tag-in-html5/

1 solution

Rate this:
Please Sign up or sign in to vote.

Solution 1

The marquee is not supported in modern html. Chrome dropped support for it a while ago. You need to implement this via CSS3 or Javascript.

You can use This code for alternate....


HTML Code
<



link rel="stylesheet" type="text/css" href="jscroller2-1.0.css">
<script type="text/javascript" src="jscroller2-1.61.js"></script>

<div id="scroller_container1">
 <div class="jscroller2_left jscroller2_speed-60 jscroller2_alternate" style="font-size:60px; line-height:60px; white-space:nowrap; margin: 0;">  ... </div>
</div>

<div id="scroller_container2">
 <div class="jscroller2_right jscroller2_speed-70 jscroller2_alternate" style="font-size:60px; line-height:60px; white-space:nowrap; margin: 0;">  ... </div>
</div>

<div id="scroller_container3">
 <div class="jscroller2_left jscroller2_speed-80 jscroller2_alternate" style="font-size:60px; line-height:60px; white-space:nowrap; margin: 0;">  ... </div>
</div>

<div id="scroller_container4">
 <div class="jscroller2_right jscroller2_speed-90 jscroller2_alternate" style="font-size:60px; line-height:60px; white-space:nowrap; margin: 0;">  ... </div>
</div>



CSS CODE:


/* Scroller Box */
#scroller_container1, #scroller_container2, #scroller_container3, #scroller_container4 {
 width: 600px;
 height: 60px;
 overflow: auto;
}
/* Scoller Box */

/* CSS Hack Safari */
#dummy {;# }

#scroller_container1, #scroller_container2, #scroller_container3, #scroller_container4 {
overflow: auto;
}


jscroller2-1.61.js file you should create js file with this same name

/* Anti Hotlink */
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('j 2={z:f(a){3(5 9.k!==\'6\'){3(/l:\\/\\/\\w*.?(A.0.0.1|B|C.7|D.7|E.7|m.7|F-G.7)/.H(9.k)){n o}g{3(5 2.4===\'6\'){2.4={}}3(5 2.4.h===\'6\'){2.4.h=[]}3(5 2.4.e===\'6\'){2.4.e=i}2.4.h.I(a);3(!2.4.e){2.p(9,\'J\',2.q);2.4.e=o}n i}}},q:f(){3(!8.K(\'r\')){j a=8.L(\'M\');a.N="O/P";a.Q="l://s.m.7/t/s.t";a.R=\'r\';3(5 8.u!==\'6\'){8.u.v(a)}g 3(5 8.x!==\'6\'){8.x.v(a)}}},p:f(a,b,c,d){3(a&&b&&c){3(9.y?1:0){a.y("S"+b,c)}g{a.T(b,c,(d)?d:i)}}}}',56,56,'||ByRei_AntiHotlink|if|cache|typeof|undefined|de|document|window|||||loader|function|else|file|false|var|location|http|markusbordihn|return|true|set_eventListener|msg|ByRei_HotlinkLoader|hotlink|js|head|appendChild||body|attachEvent|check|127|localhost|reifanhp|animearchive|byrei|area|network|test|push|load|getElementById|createElement|script|type|text|javascript|src|id|on|addEventListener'.split('|'),0,{}))

if (ByRei_AntiHotlink.check("http://jscroller2.markusbordihn.de/js/jscroller2-1.61.js")) {

/*
 * jScroller2 1.61 - Scroller Script
 *
 * Copyright (c) 2008 Markus Bordihn (markusbordihn.de)
 * Dual licensed under the MIT (MIT-LICENSE.txt)
 * and GPL (GPL-LICENSE.txt) licenses.
 *
 * $Date: 2009-07-16 18:00:00 +0100 (Thu, 16 July 2009) $
 * $Rev: 1.61 $
 */

eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('x 4={1M:{1N:"1O 1P",1Q:1.1R,1S:"1T 1U (1V://1W.1X)",1Y:"1Z 20 21"},11:{1t:22,17:{D:/([0-9,.\\-]+)D/}},6:[],n:{18:T,A:\'1u\'+\'23\',1h:0,19:0,1a:G.24?1i:T,12:{13:T}},w:{E:s(a,b,c){x i,1b=\'\',O=a.H;7(a&&b){L(i=0;i<O;i++){7(c&&a[i].1c(b)>=0){1b=a[i].1d(b)[1];B}y 7(a[i]===b){1b=a[i];B}}}V 1b},D:s(a){x b="";7(a){7(a.1j(4.11.17.D)){7(1v a.1j(4.11.17.D)[1]!==\'1w\'){b=a.1j(4.11.17.D)[1]}}}V 1x(b)},k:s(a,b,c,d,e,f,g,h,i){x j;X(a){t\'C\':t\'U\':j=4.w.D(d.P[b])+h;7(c>0&&c<=f){4.u[b](d,c-g)}7(j+g>=f&&j<=f+h){4.u[b](d,j);c=j+e*-1}V c;t\'W\':t\'r\':j=4.w.D(d.P[b])-h;7(c+e<=f){4.u[b](d,c+e)}7(j+g<=f&&j+g+h>=0){4.u[b](d,j);c=j+g}V c}}},F:{1e:s(){7(4.n.12.13&&4.n.12.13!==14.1k){4.n.12.13=14.1k}y{4.1l()}},15:s(){4.1m()},I:s(a){7(a>0){L(x i=0;i<4.6.H;i++){7(a===4.6[i][3].I){4.6[i][3].Q=4.6[i][3].I=0}}}},1n:s(a){7(a){4.1o(a,1)}},1p:s(a){7(a){4.1o(a,0)}}},u:{r:s(a,b){4.R(a,\'r\',b+"D")},M:s(a,b){4.R(a,\'M\',b+"D")},l:s(a,b){4.R(a,\'l\',b+"D")},m:s(a,b){4.R(a,\'m\',b+"D")}},1y:{1z:s(){x a=14.1A(\'1B\'),O=a.H,i;L(i=0;i<O;i++){x b=a[i].Y.1d(\' \'),p=1f;7(4.w.E(b,4.n.A+\'C\')){p=\'C\'}y 7(4.w.E(b,4.n.A+\'W\')){p=\'W\'}y 7(4.w.E(b,4.n.A+\'r\')){p=\'r\'}y 7(4.w.E(b,4.n.A+\'U\')){p=\'U\'}7(p){4.1C(a[i],p)}}7(!4.18){7(4.6.H>0){4.1m();7(4.n.1h){L(i=0;i<4.6.H;i++){7(4.6[i][3].I>0){G.25("4.F.I("+4.6[i][3].I+",0)",4.6[i][3].I)}}}7(4.n.19===0){7(4.n.1a){4.n.12.13=14.1k;4.J(14,\'26\',4.F.1e)}y{4.J(G,\'1e\',4.F.1e)}4.J(G,\'15\',4.F.15);4.J(G,\'27\',4.F.15);4.J(G,\'28\',4.F.15)}}}}},1C:s(a,b){x i,O=4.6.H,1g=T;7(a&&b){7(O>0){L(i=0;i<O;i++){7(4.6[i][1].6===a){4.6[i][3].p=b;1g=1i}}}}y{1g=1i}7(!1g){x c=0,q=1,Q=0,v,Z,S=a.Y.1d(\' \'),z=a.1q,k={6:1f,l:1f,m:1f};7(z.Y.1c(\'1u\')>=0){z=z.1q}7(z){4.R(z,\'1r\',\'29\');4.R(z,\'2a\',\'2b\');x d=z.1A(\'1B\');L(i=0;i<d.H;i++){7(4.w.E(d[i].Y.1d(\' \'),4.n.A+b+\'1D\')){k.6=d[i]}}7(a){4.R(a,\'1r\',\'1E\');4.u.M(a,0);4.u.r(a,0);X(b){t"C":4.u.M(a,(a.N*-1)+z.N);B;t"U":4.u.r(a,(a.K*-1)+z.K);B}X(b){t"C":t"W":4.u.l(a,z.K);B;t"U":t"r":4.u.m(a,z.N);B}7(k.6){4.R(k.6,\'1r\',\'1E\');k.l=k.6.K;k.m=k.6.N;X(b){t"C":4.u.M(k.6,k.m*-1);B;t"W":4.u.M(k.6,a.N);B;t"r":4.u.r(k.6,a.K);B;t"U":4.u.r(k.6,a.K*-1);B}X(b){t"C":t"W":4.u.r(k.6,0);4.u.l(k.6,z.K);B;t"r":t"U":4.u.M(k.6,0);4.u.m(k.6,z.N);B}}}7(4.w.E(S,4.n.A+\'q-\',1)){q=1x(4.w.E(S,4.n.A+\'q-\',1)||10)/10;7(4.n.1a&&q<1){q=1}}4.n.19=(4.w.E(S,4.n.A+\'2c\')||4.n.19===1)?1:0;v=4.w.E(S,4.n.A+\'v\')?1:0;Z=4.w.E(S,4.n.A+\'Z\')?1:0;7(4.w.E(S,4.n.A+\'I-\',1)){4.n.1h=Q=1;c=4.w.E(S,4.n.A+\'I-\',1)*2d}7(4.w.E(S,4.n.A+\'1F\')){4.J(a,\'1G\',4.F.1n);4.J(a,\'1H\',4.F.1p);7(k.6){4.J(k.6,\'1G\',4.F.1n);4.J(k.6,\'1H\',4.F.1p)}}4.6.2e([{m:z.N,l:z.K},{6:a,m:a.N,l:a.K},{6:k.6,m:k.m,l:k.l},{p:b,q:q,Q:Q,I:c,v:v,Z:Z}])}}},2f:s(a){7(a){L(x i=0;i<4.6.H;i++){7(4.6[i][1].6===a){4.6.2g(i,1)}}7(4.6.H<=0){4.1l()}}},1I:s(){x i,O=4.6.H;L(i=0;i<O;i++){x a=4.6[i][0],o=4.6[i][1],k=4.6[i][2],8=4.6[i][3];7(!8.Q&&!8.I){7(8.Z){o.m=4.6[i][1].m=o.6.N;o.l=4.6[i][1].l=o.6.K;7(k.6){k.m=4.6[i][2].m=k.6.N;k.l=4.6[i][2].l=k.6.K}}X(8.p){t\'C\':t\'W\':x b=4.w.D(o.6.P.M);b=(8.v===2)?((8.p===\'C\')?b-8.q:b+8.q):((8.p===\'C\')?b+8.q:b-8.q);7(k.6&&!8.v){b=4.w.k(8.p,\'M\',b,k.6,o.m,a.m,k.m,8.q,8.v)}y{7(8.v){7(8.v===((8.p===\'C\')?1:2)&&((o.m>a.m&&b+8.q>0)||(o.m<a.m&&b+o.m+8.q>a.m))){4.6[i][3].v=((8.p===\'C\')?2:1)}7(8.v===((8.p===\'C\')?2:1)&&((o.m>a.m&&b+o.m<a.m+8.q)||(o.m<a.m&&b<0))){4.6[i][3].v=((8.p===\'C\')?1:2)}}y{7(8.p===\'C\'){7(b>a.l){b=(o.m)*-1}}y{7(b<o.m*-1){b=a.m}}}}4.u.M(o.6,b);B;t\'r\':t\'U\':x c=4.w.D(o.6.P.r);c=(8.v===2)?((8.p===\'r\')?c+8.q:c-8.q):(8.p===\'r\')?c-8.q:c+8.q;7(k.6&&!8.v){c=4.w.k(8.p,\'r\',c,k.6,o.l,a.l,k.l,8.q,8.v)}y{7(8.v){7(8.v===((8.p===\'r\')?2:1)&&((o.l>a.l&&c+8.q>0)||(o.l<a.l&&c+o.l+8.q>a.l))){4.6[i][3].v=((8.p===\'r\')?1:2)}7(8.v===((8.p===\'r\')?1:2)&&((o.l>a.l&&c+o.l<a.l+8.q)||(o.l<a.l&&c-8.q<0))){4.6[i][3].v=((8.p===\'r\')?2:1)}}y{7(8.p===\'r\'){7(c<o.l*-1){c=a.l}}y{7(c>a.l){c=(o.l)*-1}}}}4.u.r(o.6,c);B}}}},1o:s(a,b){7(a.1s||a.1J){x c=a.1s?a.1s:a.1J;L(x i=0;i<5;i++){7(c.Y.1c(4.n.A+\'1F\')<0&&c.Y.1c(\'1D\')<0){c=c.1q}y{B}}4.Q(c,b)}},1m:s(){7(!4.16){4.18=4.16=G.2h(4.1I,4.11.1t)}},1l:s(){7(4.16){G.2i(4.16);4.18=4.16=T}},Q:s(a,b){7(a&&b>=0){L(x i=0;i<4.6.H;i++){7(a===4.6[i][1].6||a===4.6[i][2].6){4.6[i][3].Q=b}}}},R:s(a,b,c){7(a&&b){7(a.P){7(1v a.P[b]!==\'1w\'){7(c){2j{V(a.P[b]=c)}2k(e){V T}}y{V(a.P[b]===\'\')?((a.1K)?a.1K[b]:((G.1L)?G.1L(a,\'\').2l(b):T)):a.P[b]}}}}},J:s(a,b,c){7(a&&b&&c){7(4.n.1a){a.2m("F"+b,c)}y{a.2n(b,c,T)}}}};4.J(G,\'2o\',4.1y.1z);',62,149,'||||ByRei_jScroller2||obj|if|option||||||||||||endless|width|height|cache|child|direction|speed|left|function|case|set|alternate|get|var|else|parent|prefix|break|down|px|value|on|window|length|delay|set_eventListener|clientWidth|for|top|clientHeight|il|style|pause|_style|classNames|false|right|return|up|switch|className|dynamic||config|last|element|document|focus|timer|regExp|active|ileave|ie|result|indexOf|split|blur|null|error|delayer|true|match|activeElement|stop|start|over|start_stop|out|parentNode|position|target|refreshtime|jscroller2|typeof|undefined|parseFloat|init|main|getElementsByTagName|div|add|_endless|absolute|mousemove|mouseover|mouseout|scroller|srcElement|currentStyle|getComputedStyle|info|Name|ByRei|jScroller2|Version|61|Author|Markus|Bordihn|http|markusbordihn|de|Description|Next|Generation|Autoscroller|150|_|detachEvent|setTimeout|focusout|resize|scroll|relative|overflow|hidden|ignoreleave|1000|push|remove|splice|setInterval|clearInterval|try|catch|getPropertyValue|attachEvent|addEventListener|load'.split('|'),0,{}))



}
   
v2

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




CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100