Marquee problem for scrolling in asp.net

Question

4.00/5 (4 votes)

See more:

I have use marquee in master page in footer for show clients logo image through datalist view controls that is working fine and that is in Marquee control I have written :

XML

marquee id="myMarquee" direction="left" behavior="scroll" scrollamount="5" truespeed="truespeed" loop="-1" scrolldely="100" onmouseover="this.stop()" onmouseout="this.start()"

This is working but I want to when I drag mouse of left side or right side than scrolling direction changed and speedy scroll.

for example i want to do same as : http://www.Innovation.com . link u can see footer part..

Posted 4-Mar-11 0:34am

Niranjankr

Updated 10-Mar-11 23:33pm

v4

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

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

Manfred Rudolf Bihy · Accepted Answer · 2011-03-04T02:35:00

This is not perfect, but I hope it will give you some ideas. In my solution you don't drag but only move the mouse left or right over the marquee. Speed and direction are detected and the marquee is adjusted to reflect left and right scrolling and also the speed to some extent.
You'll probably have to play around with the calculation of the delay and the speed.

Here's the sample:

XML

<html>
<body>
X <input id="X" style="width: 2em;"/> Y <input id="Y" style="width: 2em;"/></br>
<div style="width: 4em; float:left;">Direction</div><input id="direction" style="width: 2em;"/></br>
<div style="width: 4em; float:left;">Speed</div><input id="speed" style="width: 2em;" value=""/></br>
<div style="width: 4em; float:left;">Delay</div><input id="delay" style="width: 2em;" value=""/></br>
<marquee id="myMarquee"
         direction="left"
         behavior="scroll"
         scrollamount="2"
         scrolldelay="100"
         onmouseover="mouseOver(this);"
         onmouseout="mouseOut(this);"
         onmousemove="mouseMove(this);"
         style="height: 4em; border: 2px solid red; background-color: #DDDD55; align: middle;">
    <span style="font-size: 2.0em;">This text will be scrolled left or right depending on the direction you move the mouse. Enjoy!</span>
</marquee>
<script type="text/javascript">
var mx;
var my;
var direction;
var speed;
function mouseOver(me)
{
    me.stop();
    var e = window.event;
    mx = e.clientX;
    my = e.clientY;
}

function mouseOut(me)
{
    me.start();
    mx = -1;
    my = -1;
}

function mouseMove(me)
{
    var e = window.event;
    var x = e.clientX;
    var y = e.clientY;
    if(isNaN(mx) || isNaN(my))
    {
        mx = x; my = y;
        return;
    }
    var delta = x-mx;
    direction = (delta)>0 ? 1:-1;
    speed = delta<0 ? -delta : delta;
    mx = x; my = y;
    var sxEle = document.getElementById("X");
    var syEle = document.getElementById("Y");
    var directionEle = document.getElementById("direction");
    var speedEle = document.getElementById("speed");
    var delayEle = document.getElementById("delay");
    sxEle.value=mx;
    syEle.value=my;
    directionEle.value=direction;

    me.direction = direction>0 ? "right" : "left";
    me.scrollAmount = speed;
    var mqDelay = 100 - speed*10*4;
    mqDelay = mqDelay<0 ? 1 : mqDelay;
    me.scrollDelay = mqDelay;
    speedEle.value = speed;
    delayEle.value = mqDelay;
    me.start();
}

</script>
</body>
</html>

Regards,