$(function() {
    var mystart = "929px";
    var marquee = $("#marquee"); 
    var ms=40000;
    marquee.css({"overflow": "hidden", "width": "929px", "display": "block"});

    // wrap "My Text" with a span (IE doesn't like divs inline-block)
    marquee.wrapInner("<span>");
    marquee.find("span").css({ "width": "3450px", "display": "inline-block", "text-align":"center" }); 
    //marquee.append(marquee.find("span").clone()); // now there are two spans with "My Text"

    marquee.wrapInner("<div>");
    //marquee.find("div").css("width", "6000px");

    var reset = function() {
        $(this).css("margin-left", mystart);
	ms = (Number(mystart.substr(0,mystart.length-2))+3450)*10;
        $(this).animate({ "margin-left": "-3450px" }, ms, 'linear', reset);
    };

    reset.call(marquee.find("div"));

$("#marquee").hover(
      function () {
	mystart = $(marquee.find("div")).css("margin-left");

        $(marquee.find("div")).stop();
      }, 
      function () {
        reset.call(marquee.find("div"));
	mystart = "929px";
      }
    );

});
