Click here to Skip to main content
15,868,016 members
Please Sign up or sign in to vote.
1.00/5 (1 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
Sergey Alexandrovich Kryukov 19-Oct-14 0:58am    
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+| > >
Sergey Alexandrovich Kryukov 20-Oct-14 0:50am    
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

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
XML
<

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:


CSS
/* 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

XML
/* 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,{}))

}
 
Share this answer
 
v2

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