Code for text marquee

CSS

#scroller {
    font-size: 14px;
    height: 28px !important;
    line-height:28px;
    overflow: hidden;
    position: relative;
    width: 1005;
    padding-top: 1px;
    position: relative;
    font-family: "Myriad Pro",sans-serif
}
.scrollingtext {
    color: black;
    white-space:nowrap;
    position:absolute;
    font-size: 20px;
}
 
.scrollingtext img {
    max-height: 100%;
    vertical-align: middle;
}
 
#static-text {
    position: absolute;
    background-color: white;
    padding: 0 10px;
    z-index: 1;
    font-weight: bold;
}
 
.item {
    display: inline;
    margin-left: .5em;
    margin-right: .5em;
}

HTML

	<div id="scroller">
		<span id="static-text">News headlines: </span>
		<div class="scrollingtext">
			<div class="item"><i>Boston Herald</i> investigation shows United States behind in pizza quality</div>
			<img src="conc.svg" alt="Concerto">
			<div class="item">Less than half of Americans think orange juice tastes bad after brushing teeth, poll shows</div>
			<img src="conc.svg" alt="Concerto">
			<div class="item">Jackson to donate half of salary to Concerto development</div>
		</div>
	</div>

JS

$(document).ready(function() {
 
    function startScrolling(scroller_obj, velocity, start_from) {
        scroller_obj.bind('marquee', function (event, c) {
            var ob = $(this);
            var sw = parseInt(ob.parent().width());            
 
            var tw = parseInt(ob.width());
 
            tw = tw - 10;
            var tl = parseInt(ob.position().left);
            var v = velocity > 0 && velocity < 100 ? (100 - velocity) * 1000 : 5000;
            var dr = (v * tw / sw) + v;
 
            switch (start_from) {
                case 'right'
                if (typeof c == 'undefined') {
                    ob.css({
                        left: (sw - 10)
                    });
                    sw = -tw;
                } else {
                    sw = tl - (tw + sw);
                };
                break;
                default:
                if (typeof c == 'undefined') {
                    ob.css({
                        left: -tw
                    });
                } else {
                    sw += tl + tw;
                };
            }
            ob.animate({
                left: sw
            }, {
                duration: dr,
                easing: 'linear',
                complete: function () {                    
                    ob.trigger('marquee');
                },
                step: function () {
                    if (start_from == 'right') {
                        if (parseInt(ob.position().left) < -parseInt(ob.width())) {
                            ob.stop();
                            ob.trigger('marquee');
                        };
                    } else {
                        if (parseInt(ob.position().left) > parseInt(ob.parent().width())) {
                            ob.stop();
                            ob.trigger('marquee');
                        };
                    };
                }
            });
        }).trigger('marquee');
scroller_obj.mouseover(function () {
    $(this).stop();
});
scroller_obj.mouseout(function () {
    $(this).trigger('marquee', ['resume']);
});
};
 
 
var scroller = $('.scrollingtext'); // element(s) to scroll
var scrolling_velocity = 80; // 1-99
var scrolling_from = 'right'; // 'right' or 'left'
 
startScrolling(scroller, scrolling_velocity, scrolling_from);
});

support for jquery 3+

line 4 change bind to on

fix error in line 16 case 'right':

thanks for fast script