大屏列表上下滚动插件 liMarquee – jQuery

小鱼儿 2023-02-16 00:44 31阅读 0赞

#### 大屏 列表上下滚动 插件 liMarquee – jQuery ####

1.  下载 liMarquee.js
2.  引入 liMarquee.css 和 liMarquee.js ： `<link rel="stylesheet" href="css/liMarquee.css">` 、 `<script src="js/jquery.liMarquee.js"></script>`
3.  使用liMarquee插件  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3d1ajE5MzU_size_16_color_FFFFFF_t_70]  
    index.html  
    `<script src=" js/jquery.liMarquee.js "></script>` 下方有代码，可直接复制  
    `<link rel="stylesheet" href="css/liMarquee.css">` 下方有代码，可直接复制

<!DOCTYPE html>
    <html lang="zh-CN">
    
    <head>
        <meta charset="utf-8">
        <title>jQuery无缝滚动插件liMarquee演示-向上滚动_abc</title>
        <link rel="stylesheet" href="css/liMarquee.css">
        <style>
            .abc { 
                width: 790px;
                height: 200px;
                margin: 100px auto;
                font-size: 14px;
            }
            
            .abc ul { 
                margin: 0;
                line-height: 30px;
            }
            
            .abc a { 
                color: #333;
                text-decoration: none;
            }
            
            .abc a:hover { 
                text-decoration: underline;
            }
        </style>
    </head>
    
    <body>
        <h1>向上滚动</h1>
    
        <div class="abc">
            <ul>
                <li>
                    <a href="#">Smoothslides – 可平移的jQuery幻灯片插件</a>
                </li>
                <li>
                    <a href="#">jQuery全屏滚动插件fullPage.js</a>
                </li>
                <li>
                    <a href="#">WOW.js – 让页面滚动更有趣</a>
                </li>
                <li>
                    <a href="#">让IE7 IE8支持CSS3 background-size属性</a>
                </li>
                <li>
                    <a href="#">shCircleLoader – jQuery Loading效果插件</a>
                </li>
                <li>
                    <a href="#">jQuery cForm – jQuery表单美化插件</a>
                </li>
                <li>
                    <a href="#">Quttons – Quantum Paper风格按钮</a>
                </li>
                <li>
                    <a href="#">Ideal Image Slider – 简单的纯JS幻灯片</a>
                </li>
                <li>
                    <a href="#">evenZoom – jQuery放大镜插件</a>
                </li>
                <li>
                    <a href="#">DAD – jQuery拖拽/拖放插件</a>
                </li>
            </ul>
        </div>
    
        <script src=" js/jquery-1.8.3.min.js "></script>
        <script src=" js/jquery.liMarquee.js "></script>
        <script>
            $(function() { 
                $('.abc').liMarquee({ 
                    direction: 'up'
                });
            });
        </script>
    </body>
    
    </html>

--------------------

css/liMarquee.css

/*Plugin CSS*/
    
    .str_wrap { 
        overflow: hidden;
        //zoom:1;
        width: 100%;
        font-size: 12px;
        line-height: 16px;
        position: relative;
        -moz-user-select: none;
        -khtml-user-select: none;
        user-select: none;
        background: #f6f6f6;
        white-space: nowrap;
    }
    
    .str_wrap.str_active { 
        background: #f1f1f1;
    }
    
    .str_move { 
        white-space: nowrap;
        position: absolute;
        top: 0;
        left: 0;
        cursor: move;
    }
    
    .str_move_clone { 
        display: inline-block;
        //display:inline;
        //zoom:1;
        vertical-align: top;
        position: absolute;
        left: 100%;
        top: 0;
    }
    
    .str_vertical .str_move_clone { 
        left: 0;
        top: 100%;
    }
    
    .str_down .str_move_clone { 
        left: 0;
        bottom: 100%;
    }
    
    .str_vertical .str_move,
    .str_down .str_move { 
        white-space: normal;
        width: 100%;
    }
    
    .str_static .str_move,
    .no_drag .str_move,
    .noStop .str_move { 
        cursor: inherit;
    }
    
    .str_wrap img { 
        max-width: none !important;
    }

--------------------

js/jquery.liMarquee.js

/*
     * jQuery liMarquee v 4.6
     *
     * Copyright 2013, Linnik Yura | LI MASS CODE | http://masscode.ru
     * http://masscode.ru/index.php/k2/item/44-limarquee
     * Free to use
     *
     * Last Update 20.11.2014
     */
    (function ($) { 
    	var methods = { 
    		init: function (options) { 
    			var p = { 
    				direction: 'left', //Указывает направление движения содержимого контейнера (left | right | up | down)
    				loop: -1, //Задает, сколько раз будет прокручиваться содержимое. "-1" для бесконечного воспроизведения движения
    				scrolldelay: 0, //Величина задержки в миллисекундах между движениями
    				scrollamount: 50, //Скорость движения контента (px/sec)
    				circular: true, //Если "true" - строка непрерывная 
    				drag: true, //Если "true" - включено перетаскивание строки
    				runshort: true, //Если "true" - короткая строка тоже "бегает", "false" - стоит на месте
    				hoverstop: true, //true - строка останавливается при наведении курсора мыши, false - строка не останавливается
    				inverthover: false, //false - стандартное поведение. Если "true" - строка начинает движение только при наведении курсора
    				xml: false //Путь к xml файлу с нужным текстом
    			};
    			if (options) { 
    				$.extend(p, options);
    			}
    
    			return this.each(function () { 
    				var enterEvent = 'mouseenter';
    				var leaveEvent = 'mouseleave';
    				if(p.inverthover){ 
    					enterEvent = 'mouseleave';
    					leaveEvent = 'mouseenter';	
    				}
    				
    								
    				var
    					loop = p.loop,
    					strWrap = $(this).addClass('str_wrap').data({ scrollamount:p.scrollamount}),
    					fMove = false;
    					
    				
    				
    				var strWrapStyle = strWrap.attr('style'); 
    				
    				if(strWrapStyle){ 
    					var wrapStyleArr = strWrapStyle.split(';');
    					var startHeight = false;
    					for(var i=0; i < wrapStyleArr.length; i++){ 
    						var str = $.trim(wrapStyleArr[i]);					
    						var tested =  str.search(/^height/g);
    						if(tested != -1){ 
    							startHeight = parseFloat(strWrap.css('height'));
    						}
    					}
    				}
    
    				var code = function () { 
    					
    					strWrap.off('mouseleave');
    					strWrap.off('mouseenter');
    					strWrap.off('mousemove');
    					strWrap.off('mousedown');
    					strWrap.off('mouseup');
    
    					
    					if(!$('.str_move',strWrap).length){ 
    						strWrap.wrapInner($('<div>').addClass('str_move'));
    					}
    					
    					var
    					strMove = $('.str_move', strWrap).addClass('str_origin'),
    					strMoveClone = strMove.clone().removeClass('str_origin').addClass('str_move_clone'),
    					time = 0;
    
    					if (!p.hoverstop) { 
    						strWrap.addClass('noStop');
    					}
    
    					var circCloneHor = function(){ 
    						strMoveClone.clone().css({ 
    							left:'100%',
    							right:'auto',							
    							width: strMove.width()
    						}).appendTo(strMove);
    						strMoveClone.css({ 
    							right: '100%',
    							left:'auto',
    							width: strMove.width()
    						}).appendTo(strMove);
    					}
    					
    					var circCloneVert = function(){ 
    						strMoveClone.clone().css({ 
    							top: '100%',
    							bottom:'auto',
    							height: strMove.height()
    						}).appendTo(strMove);
    						strMoveClone.css({ 
    							bottom: '100%',
    							top:'auto',
    							height:strMove.height()
    						}).appendTo(strMove);
    					}
    					
    					
    					
    					if (p.direction == 'left') { 
    						strWrap.height(strMove.outerHeight())
    						if (strMove.width() > strWrap.width()) { 
    							var leftPos = -strMove.width();
    							
    							if (p.circular) { 
    								
    								if (!p.xml) { 
    									circCloneHor()
    									leftPos = -(strMove.width() + (strMove.width() - strWrap.width()));
    								}
    							}
    							if (p.xml) { 
    								strMove.css({ 
    									left:strWrap.width()	
    								})
    							}
    							var
    							strMoveLeft = strWrap.width(),
    								k1 = 0,
    								timeFunc1 = function () { 
    									var
    									fullS = Math.abs(leftPos),
    										time = (fullS / strWrap.data('scrollamount')) * 1000;
    									if (parseFloat(strMove.css('left')) != 0) { 
    										fullS = (fullS + strWrap.width());
    										time = (fullS - (strWrap.width() - parseFloat(strMove.css('left')))) / strWrap.data('scrollamount') * 1000;
    									}
    									return time;
    								},
    								moveFuncId1 = false,
    								moveFunc1 = function () { 
    									if (loop != 0) { 
    										strMove.stop(true).animate({ 
    											left: leftPos
    										}, timeFunc1(), 'linear', function () { 
    											$(this).css({ 
    												left: strWrap.width()
    											});
    											if (loop == -1) { 
    												moveFuncId1 = setTimeout(moveFunc1, p.scrolldelay);
    											} else { 
    												loop--;
    												moveFuncId1 = setTimeout(moveFunc1, p.scrolldelay);
    											}
    										});
    									}
    								};
    								strWrap.data({ 
    									moveId: moveFuncId1	,
    									moveF : moveFunc1
    								})
    								if(!p.inverthover){ 
    									moveFunc1();
    								}
    							
    							if (p.hoverstop) { 
    								strWrap.on(enterEvent, function () { 
    									$(this).addClass('str_active');
    									clearTimeout(moveFuncId1);
    									strMove.stop(true);
    								}).on(leaveEvent, function () { 
    									$(this).removeClass('str_active');
    									$(this).off('mousemove');
    									moveFunc1();
    								});
    
    								if (p.drag) { 
    									strWrap.on('mousedown', function (e) { 
    										if(p.inverthover){ 
    											strMove.stop(true);
    										}
    										//drag
    										var dragLeft;
    										var dir = 1;
    										var newX;
    										var oldX = e.clientX;
    										//drag
    										
    										strMoveLeft = strMove.position().left;
    										k1 = strMoveLeft - (e.clientX - strWrap.offset().left);
    										
    										
    										
    										$(this).on('mousemove', function (e) { 
    											fMove = true;
    											
    											//drag
    											newX = e.clientX;
    											if(newX > oldX){ 
    												dir = 1
    											}else{ 
    												dir = -1
    											}
    											oldX = newX	
    											dragLeft = k1 + (e.clientX - strWrap.offset().left);
    											
    											if (!p.circular) { 
    												if(dragLeft < -strMove.width() && dir < 0){ 
    													dragLeft = strWrap.width();
    													strMoveLeft = strMove.position().left;
    													k1 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    												if(dragLeft > strWrap.width() && dir > 0){ 
    													dragLeft = -strMove.width();
    													strMoveLeft = strMove.position().left;
    													k1 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    											}else{ 
    												if(dragLeft < -strMove.width() && dir < 0){ 
    													dragLeft = 0;
    													strMoveLeft = strMove.position().left;
    													k1 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    												if(dragLeft > 0 && dir > 0){ 
    													dragLeft = -strMove.width();
    													strMoveLeft = strMove.position().left;
    													k1 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    	
    											}
    											
    											
    											strMove.stop(true).css({ 
    												left: dragLeft
    											});
    											//drag
    											
    										
    											
    										}).on('mouseup', function () { 
    											$(this).off('mousemove');
    											if(p.inverthover){ 
    												strMove.trigger('mouseenter')
    											}
    											setTimeout(function () {                              
    												fMove = false
    											}, 50)
    											
    										});
    										return false;
    									})
    									.on('click', function () { 
    										if (fMove) { 
    											return false
    										}
    									});
    								} else { 
    									strWrap.addClass('no_drag');
    								};
    							}
    						} else { 
    							if (p.runshort) { 
    								strMove.css({ 
    									left: strWrap.width()
    								});
    								var
    								strMoveLeft = strWrap.width(),
    									k1 = 0,
    									timeFunc = function () { 
    										time = (strMove.width() + strMove.position().left) / strWrap.data('scrollamount') * 1000;
    										return time;
    									};
    								var moveFunc = function () { 
    									var leftPos = -strMove.width();
    									strMove.animate({ 
    										left: leftPos
    									}, timeFunc(), 'linear', function () { 
    										$(this).css({ 
    											left: strWrap.width()
    										});
    										if (loop == -1) { 
    											setTimeout(moveFunc, p.scrolldelay);
    										} else { 
    											loop--;
    											setTimeout(moveFunc, p.scrolldelay);
    										}
    									});
    								};
    								strWrap.data({ 
    									moveF : moveFunc
    								})
    								if(!p.inverthover){ 
    									moveFunc();
    								}
    								if (p.hoverstop) { 
    									strWrap.on(enterEvent, function () { 
    										$(this).addClass('str_active');
    										strMove.stop(true);
    									}).on(leaveEvent, function () { 
    										$(this).removeClass('str_active');
    										$(this).off('mousemove');
    										moveFunc();
    									});
    
    									if (p.drag) { 
    										strWrap.on('mousedown', function (e) { 
    											if(p.inverthover){ 
    												strMove.stop(true);
    											}
    											
    											//drag
    											var dragLeft;
    											var dir = 1;
    											var newX;
    											var oldX = e.clientX;
    											//drag
    											
    											strMoveLeft = strMove.position().left;
    											k1 = strMoveLeft - (e.clientX - strWrap.offset().left);
    											$(this).on('mousemove', function (e) { 
    												fMove = true;
    												
    												
    												//drag
    												newX = e.clientX;
    												if(newX > oldX){ 
    													dir = 1
    												}else{ 
    													dir = -1
    												}
    												oldX = newX	
    												dragLeft = k1 + (e.clientX - strWrap.offset().left);
    												
    												if(dragLeft < -strMove.width() && dir < 0){ 
    													dragLeft = strWrap.width();
    													strMoveLeft = strMove.position().left;
    													k1 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    												if(dragLeft > strWrap.width() && dir > 0){ 
    													dragLeft = -strMove.width();
    													strMoveLeft = strMove.position().left;
    													k1 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    												
    												
    												strMove.stop(true).css({ 
    													left: dragLeft
    												});
    												
    												
    												
    											}).on('mouseup', function () { 
    												if(p.inverthover){ 
    													strMove.trigger('mouseenter')
    												}
    												$(this).off('mousemove');
    												setTimeout(function () {                              
    													fMove = false
    												}, 50)
    											});
    											return false;
    										})
    										.on('click', function () { 
    											if (fMove) { 
    												return false
    											}
    										});
    									} else { 
    										strWrap.addClass('no_drag');
    									};
    								}
    							} else { 
    								strWrap.addClass('str_static');
    							}
    						};
    					};
    					if (p.direction == 'right') { 
    						strWrap.height(strMove.outerHeight())
    						strWrap.addClass('str_right');
    						strMove.css({ 
    							left: -strMove.width(),
    							right: 'auto'
    						})
    						
    						if (strMove.width() > strWrap.width()) { 
    							var leftPos = strWrap.width();
    							strMove.css({ 
    								left: 0
    							})
    							if (p.circular) { 
    								if (!p.xml) { 
    									circCloneHor()
    									//Определяем крайнюю точку
    									leftPos = strMove.width();
    								}
    							}
    							
    							var
    							k2 = 0;
    							timeFunc = function () { 
    								var
    								fullS = strWrap.width(), //крайняя точка
    									time = (fullS / strWrap.data('scrollamount')) * 1000; //время
    								if (parseFloat(strMove.css('left')) != 0) { 
    									fullS = (strMove.width() + strWrap.width());
    									time = (fullS - (strMove.width() + parseFloat(strMove.css('left')))) / strWrap.data('scrollamount') * 1000;
    								}
    								return time;
    							};
    							var moveFunc = function () { 
    
    								if (loop != 0) { 
    									strMove.animate({ 
    										left: leftPos
    									}, timeFunc(), 'linear', function () { 
    										$(this).css({ 
    											left: -strMove.width()
    										});
    										if (loop == -1) { 
    											setTimeout(moveFunc, p.scrolldelay);
    										} else { 
    											loop--;
    											setTimeout(moveFunc, p.scrolldelay);
    										};
    									});
    								};
    							};
    							strWrap.data({ 
    								moveF : moveFunc
    							})
    					
    							if(!p.inverthover){ 
    								moveFunc();
    							}
    							if (p.hoverstop) { 
    								strWrap.on(enterEvent, function () { 
    									$(this).addClass('str_active');
    									strMove.stop(true);
    								}).on(leaveEvent, function () { 
    									$(this).removeClass('str_active');
    									$(this).off('mousemove');
    									moveFunc();
    								});
    
    								if (p.drag) { 
    									
    									strWrap.on('mousedown', function (e) { 
    										if(p.inverthover){ 
    											strMove.stop(true);
    										}
    										
    										
    										//drag
    										var dragLeft;
    										var dir = 1;
    										var newX;
    										var oldX = e.clientX;
    										//drag
    										
    										strMoveLeft = strMove.position().left;
    										k2 = strMoveLeft - (e.clientX - strWrap.offset().left);
    										$(this).on('mousemove', function (e) { 
    											
    											fMove = true;
    											
    											//drag
    											newX = e.clientX;
    											if(newX > oldX){ 
    												dir = 1
    											}else{ 
    												dir = -1
    											}
    											oldX = newX	
    											dragLeft = k2 + (e.clientX - strWrap.offset().left);
    
    
    											if (!p.circular) { 
    
    												if(dragLeft < -strMove.width() && dir < 0){ 
    													dragLeft = strWrap.width();
    													strMoveLeft = strMove.position().left;
    													k2 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    												if(dragLeft > strWrap.width() && dir > 0){ 
    													dragLeft = -strMove.width();
    													strMoveLeft = strMove.position().left;
    													k2 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    											}else{ 
    												if(dragLeft < -strMove.width() && dir < 0){ 
    													dragLeft = 0;
    													strMoveLeft = strMove.position().left;
    													k2 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    												if(dragLeft > 0 && dir > 0){ 
    													dragLeft = -strMove.width();
    													strMoveLeft = strMove.position().left;
    													k2 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    	
    											}
    											
    											strMove.stop(true).css({ 
    												left: dragLeft
    											});
    											
    
    										}).on('mouseup', function () { 
    											if(p.inverthover){ 
    												strMove.trigger('mouseenter')
    											}
    											$(this).off('mousemove');
    											setTimeout(function () {                              
    												fMove = false
    											}, 50)
    										});
    										return false;
    									})
    									.on('click', function () { 
    										if (fMove) { 
    											return false
    										}
    									});
    								} else { 
    									strWrap.addClass('no_drag');
    								};
    							}
    						} else { 
    														
    							if (p.runshort) { 
    								
    								var k2 = 0;
    								var timeFunc = function () { 
    									time = (strWrap.width() - strMove.position().left) / strWrap.data('scrollamount') * 1000;
    									return time;
    								};
    								var moveFunc = function () { 
    									var leftPos = strWrap.width();
    									strMove.animate({ 
    										left: leftPos
    									}, timeFunc(), 'linear', function () { 
    										$(this).css({ 
    											left: -strMove.width()
    										});
    										if (loop == -1) { 
    											setTimeout(moveFunc, p.scrolldelay);
    										} else { 
    											loop--;
    											setTimeout(moveFunc, p.scrolldelay);
    										};
    									});
    								};
    
    								strWrap.data({ 
    									moveF : moveFunc
    								})
    
    								if(!p.inverthover){ 
    									moveFunc();
    								}
    								if (p.hoverstop) { 
    									strWrap.on(enterEvent, function () { 
    										$(this).addClass('str_active');
    										strMove.stop(true);
    									}).on(leaveEvent, function () { 
    										$(this).removeClass('str_active');
    										$(this).off('mousemove');
    										moveFunc();
    									});
    
    									if (p.drag) { 
    										strWrap.on('mousedown', function (e) { 
    											if(p.inverthover){ 
    												strMove.stop(true);
    											}
    											
    											//drag
    											var dragLeft;
    											var dir = 1;
    											var newX;
    											var oldX = e.clientX;
    											//drag
    											
    											strMoveLeft = strMove.position().left;
    											k2 = strMoveLeft - (e.clientX - strWrap.offset().left);
    											$(this).on('mousemove', function (e) { 
    												fMove = true;
    												
    												
    												
    												//drag
    												newX = e.clientX;
    												if(newX > oldX){ 
    													dir = 1
    												}else{ 
    													dir = -1
    												}
    												oldX = newX	
    												dragLeft = k2 + (e.clientX - strWrap.offset().left);
    												
    												if(dragLeft < -strMove.width() && dir < 0){ 
    													dragLeft = strWrap.width();
    													strMoveLeft = strMove.position().left;
    													k2 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    												if(dragLeft > strWrap.width() && dir > 0){ 
    													dragLeft = -strMove.width();
    													strMoveLeft = strMove.position().left;
    													k2 = strMoveLeft - (e.clientX - strWrap.offset().left);
    												}
    
    												strMove.stop(true).css({ 
    													left:dragLeft
    												});
    												
    											}).on('mouseup', function () { 
    												if(p.inverthover){ 
    													strMove.trigger('mouseenter')
    												}
    												$(this).off('mousemove');
    												setTimeout(function () {                              
    													fMove = false
    												}, 50)
    											});
    											return false;
    										})
    										.on('click', function () { 
    											if (fMove) { 
    												return false
    											}
    										});
    									} else { 
    										strWrap.addClass('no_drag');
    									};
    								}
    							} else { 
    								strWrap.addClass('str_static');
    							}
    						};
    					};
    					if (p.direction == 'up') { 
    						strWrap.addClass('str_vertical');
    						
    						if (strMove.height() > strWrap.height()) { 
    							var topPos = -strMove.height();
    							if (p.circular) { 
    								if (!p.xml) { 
    									circCloneVert();									
    									topPos = -(strMove.height() + (strMove.height() - strWrap.height()));
    								}
    							}
    							if (p.xml) { 
    								strMove.css({ 
    									top:strWrap.height()	
    								})
    							}
    							var
    							k2 = 0;
    							timeFunc = function () { 
    								var
    								fullS = Math.abs(topPos),
    									time = (fullS / strWrap.data('scrollamount')) * 1000;
    								if (parseFloat(strMove.css('top')) != 0) { 
    									fullS = (fullS + strWrap.height());
    									time = (fullS - (strWrap.height() - parseFloat(strMove.css('top')))) / strWrap.data('scrollamount') * 1000;
    								}
    								
    								return time;
    							};
    							var moveFunc = function () { 
    								if (loop != 0) { 
    									strMove.animate({ 
    										top: topPos
    									}, timeFunc(), 'linear', function () { 
    										$(this).css({ 
    											top: strWrap.height()
    										});
    										if (loop == -1) { 
    											setTimeout(moveFunc, p.scrolldelay);
    										} else { 
    											loop--;
    											setTimeout(moveFunc, p.scrolldelay);
    										};
    									});
    								};
    							};
    							
    							strWrap.data({ 
    								moveF : moveFunc
    							})
    							
    							if(!p.inverthover){ 
    								moveFunc();
    							}
    							if (p.hoverstop) { 
    								strWrap.on(enterEvent, function () { 
    									$(this).addClass('str_active');
    									strMove.stop(true);
    								}).on(leaveEvent, function () { 
    									$(this).removeClass('str_active');
    									$(this).off('mousemove');
    									moveFunc();
    								});
    
    								if (p.drag) { 
    									strWrap.on('mousedown', function (e) { 
    										if(p.inverthover){ 
    											strMove.stop(true);
    										}
    										
    										//drag
    										var dragTop;
    										var dir = 1;
    										var newY;
    										var oldY = e.clientY;
    										//drag
    										
    										
    										strMoveTop = strMove.position().top;
    										k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    										$(this).on('mousemove', function (e) { 
    											
    											fMove = true;
    
    											//drag
    											newY = e.clientY;
    											if(newY > oldY){ 
    												dir = 1
    											}else{ 
    												if(newY < oldY){ 
    													dir = -1
    												}
    											}
    											oldY = newY	
    											dragTop = k2 + e.clientY - strWrap.offset().top;
    
    
    											if (!p.circular){ 
    												if(dragTop < -strMove.height() && dir < 0){ 
    													dragTop = strWrap.height();
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}
    												if(dragTop > strWrap.height() && dir > 0){ 
    													dragTop = -strMove.height();
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}	
    											}else{ 
    												if(dragTop < -strMove.height() && dir < 0){ 
    													dragTop = 0;
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}
    												if(dragTop > 0 && dir > 0){ 
    													dragTop = -strMove.height();
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}
    											}
    
    
    											strMove.stop(true).css({ 
    												top: dragTop
    											});
    											//drag
    											
    											
    											
    											
    											
    											
    											
    											
    											
    											
    											
    											
    										}).on('mouseup', function () { 
    											if(p.inverthover){ 
    												strMove.trigger('mouseenter')
    											}
    											$(this).off('mousemove');
    											setTimeout(function () {                              
    												fMove = false
    											}, 50)
    										});
    										return false;
    									})
    									.on('click', function () { 
    										if (fMove) { 
    											return false
    										}
    									});
    								} else { 
    									strWrap.addClass('no_drag');
    								};
    							}
    						} else { 
    							if (p.runshort) { 
    								strMove.css({ 
    									top: strWrap.height()
    								});
    								var k2 = 0;
    								var timeFunc = function () { 
    									
    									time = (strMove.height() + strMove.position().top) / strWrap.data('scrollamount') * 1000;
    									
    									return time;
    								};
    								var moveFunc = function () { 
    									var topPos = -strMove.height();
    									strMove.animate({ 
    										top: topPos
    									}, timeFunc(), 'linear', function () { 
    										$(this).css({ 
    											top: strWrap.height()
    										});
    										if (loop == -1) { 
    											setTimeout(moveFunc, p.scrolldelay);
    										} else { 
    											loop--;
    											setTimeout(moveFunc, p.scrolldelay);
    										};
    									});
    								};
    								strWrap.data({ 
    									moveF : moveFunc
    								})
    								if(!p.inverthover){ 
    									moveFunc();
    								}
    								if (p.hoverstop) { 
    									strWrap.on(enterEvent, function () { 
    										$(this).addClass('str_active');
    										strMove.stop(true);
    									}).on(leaveEvent, function () { 
    										$(this).removeClass('str_active');
    										$(this).off('mousemove');
    										moveFunc();
    									});
    
    									if (p.drag) { 
    										strWrap.on('mousedown', function (e) { 
    											if(p.inverthover){ 
    												strMove.stop(true);
    											}
    											
    											//drag
    											var dragTop;
    											var dir = 1;
    											var newY;
    											var oldY = e.clientY;
    											//drag
    											
    											strMoveTop = strMove.position().top;
    											k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    											$(this).on('mousemove', function (e) { 
    												
    												
    												fMove = true;
    
    												//drag
    												newY = e.clientY;
    												if(newY > oldY){ 
    													dir = 1
    												}else{ 
    													if(newY < oldY){ 
    														dir = -1
    													}
    												}
    												oldY = newY	
    												dragTop = k2 + e.clientY - strWrap.offset().top;
    												
    												if(dragTop < -strMove.height() && dir < 0){ 
    													dragTop = strWrap.height();
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}
    												if(dragTop > strWrap.height() && dir > 0){ 
    													dragTop = -strMove.height();
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}	
    												//*drag
    												
    												strMove.stop(true).css({ 
    													top: dragTop
    												});
    												
    												
    											}).on('mouseup', function () { 
    												if(p.inverthover){ 
    													strMove.trigger('mouseenter')
    												}
    												$(this).off('mousemove');
    												setTimeout(function () {                              
    													fMove = false
    												}, 50)
    											});
    											return false;
    										})
    										.on('click', function () { 
    											if (fMove) { 
    												return false
    											}
    										});
    									} else { 
    										strWrap.addClass('no_drag');
    									};
    								}
    							} else { 
    								strWrap.addClass('str_static');
    							}
    						};
    					};
    					if (p.direction == 'down') { 
    
    						strWrap.addClass('str_vertical').addClass('str_down');
    						strMove.css({ 
    							top: -strMove.height(),
    							bottom: 'auto'
    						})
    						if (strMove.height() > strWrap.height()) { 
    							var topPos = strWrap.height();
    							if (p.circular) { 
    								if (!p.xml) { 
    									circCloneVert();									
    									topPos = strMove.height();
    								}
    							}
    							if (p.xml) { 
    								strMove.css({ 
    									top:-strMove.height()
    								})
    							}
    							var
    							k2 = 0;
    							timeFunc = function () { 
    								var
    								fullS = strWrap.height(), //крайняя точка
    									time = (fullS / strWrap.data('scrollamount')) * 1000; //время
    
    								if (parseFloat(strMove.css('top')) != 0) { 
    									fullS = (strMove.height() + strWrap.height());
    									time = (fullS - (strMove.height() + parseFloat(strMove.css('top')))) / strWrap.data('scrollamount') * 1000;
    								}
    								return time;
    							};
    							var moveFunc = function () { 
    
    								if (loop != 0) { 
    									strMove.animate({ 
    										top: topPos
    									}, timeFunc(), 'linear', function () { 
    										$(this).css({ 
    											top: -strMove.height()
    										});
    										if (loop == -1) { 
    
    											setTimeout(moveFunc, p.scrolldelay);
    										} else { 
    											loop--;
    											setTimeout(moveFunc, p.scrolldelay);
    										};
    									});
    								};
    							};
    							strWrap.data({ 
    								moveF : moveFunc
    							})
    							if(!p.inverthover){ 
    								moveFunc();
    							}
    							if (p.hoverstop) { 
    								strWrap.on(enterEvent, function () { 
    									$(this).addClass('str_active');
    									strMove.stop(true);
    								}).on(leaveEvent, function () { 
    									$(this).removeClass('str_active');
    									$(this).off('mousemove');
    									moveFunc();
    								});
    
    								if (p.drag) { 
    									strWrap.on('mousedown', function (e) { 
    										if(p.inverthover){ 
    											strMove.stop(true);
    										}
    										
    										//drag
    										var dragTop;
    										var dir = 1;
    										var newY;
    										var oldY = e.clientY;
    										//drag
    										
    										
    										strMoveTop = strMove.position().top;
    										k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    										$(this).on('mousemove', function (e) { 
    											
    											fMove = true;
    											
    											//drag
    											newY = e.clientY;
    											if(newY > oldY){ 
    												dir = 1
    											}else{ 
    												if(newY < oldY){ 
    													dir = -1
    												}
    											}
    											oldY = newY	
    											dragTop = k2 + e.clientY - strWrap.offset().top;
    
    
    											if (!p.circular){ 
    												if(dragTop < -strMove.height() && dir < 0){ 
    													dragTop = strWrap.height();
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}
    												if(dragTop > strWrap.height() && dir > 0){ 
    													dragTop = -strMove.height();
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}	
    											}else{ 
    												if(dragTop < -strMove.height() && dir < 0){ 
    													dragTop = 0;
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}
    												if(dragTop > 0 && dir > 0){ 
    													dragTop = -strMove.height();
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}
    											}
    
    
    											strMove.stop(true).css({ 
    												top: dragTop
    											});
    											//drag
    
    
    
    										}).on('mouseup', function () { 
    											if(p.inverthover){ 
    												strMove.trigger('mouseenter')
    											}
    											$(this).off('mousemove');
    											setTimeout(function () {                              
    												fMove = false
    											}, 50)
    										});
    										return false;
    									})
    									.on('click', function () { 
    										if (fMove) { 
    											return false
    										}
    									});
    								} else { 
    									strWrap.addClass('no_drag');
    								};
    							}
    						} else { 
    							if (p.runshort) { 
    								var k2 = 0;
    								var timeFunc = function () { 
    									time = (strWrap.height() - strMove.position().top) / strWrap.data('scrollamount') * 1000;
    									return time;
    								};
    								var moveFunc = function () { 
    									var topPos = strWrap.height();
    									strMove.animate({ 
    										top: topPos
    									}, timeFunc(), 'linear', function () { 
    										$(this).css({ 
    											top: -strMove.height()
    										});
    										if (loop == -1) { 
    											setTimeout(moveFunc, p.scrolldelay);
    										} else { 
    											loop--;
    											setTimeout(moveFunc, p.scrolldelay);
    										};
    									});
    								};
    								strWrap.data({ 
    									moveF : moveFunc
    								})
    								if(!p.inverthover){ 
    									moveFunc();
    								}
    								if (p.hoverstop) { 
    									strWrap.on(enterEvent, function () { 
    										$(this).addClass('str_active');
    										strMove.stop(true);
    									}).on(leaveEvent, function () { 
    										$(this).removeClass('str_active');
    										$(this).off('mousemove');
    										moveFunc();
    									});
    
    									if (p.drag) { 
    										strWrap.on('mousedown', function (e) { 
    											if(p.inverthover){ 
    												strMove.stop(true);
    											}
    											
    											//drag
    											var dragTop;
    											var dir = 1;
    											var newY;
    											var oldY = e.clientY;
    											//drag
    											
    											strMoveTop = strMove.position().top;
    											k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    											$(this).on('mousemove', function (e) { 
    												fMove = true;
    
    												//drag
    												newY = e.clientY;
    												if(newY > oldY){ 
    													dir = 1
    												}else{ 
    													if(newY < oldY){ 
    														dir = -1
    													}
    												}
    												oldY = newY	
    												dragTop = k2 + e.clientY - strWrap.offset().top;
    	
    	
    												if(dragTop < -strMove.height() && dir < 0){ 
    													dragTop = strWrap.height();
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}
    												if(dragTop > strWrap.height() && dir > 0){ 
    													dragTop = -strMove.height();
    													strMoveTop = strMove.position().top;
    													k2 = strMoveTop - (e.clientY - strWrap.offset().top);
    												}	
    												//*drag
    												
    												strMove.stop(true).css({ 
    													top: dragTop
    												});
    												
    												
    												
    												
    												
    												
    												
    												
    											}).on('mouseup', function () { 
    												if(p.inverthover){ 
    													strMove.trigger('mouseenter')
    												}
    												$(this).off('mousemove');
    												setTimeout(function () {                              
    													fMove = false
    												}, 50)
    											})
    											return false;
    										})
    										.on('click', function () { 
    											if (fMove) { 
    												return false
    											}
    										});
    									} else { 
    										strWrap.addClass('no_drag');
    									};
    								}
    							} else { 
    								strWrap.addClass('str_static');
    							}
    						};
    					};
    					
    					
    					
    					
    				}
    				if (p.xml) { 
    					$.ajax({ 
    						url: p.xml,
    						dataType: "xml",
    						success: function (xml) { 
    							var xmlTextEl = $(xml).find('text');
    							var xmlTextLength = xmlTextEl.length;
    							for(var i = 0; i < xmlTextLength; i++){ 
    								var xmlElActive = xmlTextEl.eq(i);
    								var xmlElContent = xmlElActive.text();
    								var xmlItemEl = $('<span>').text(xmlElContent).appendTo(strWrap);
    								
    								if(p.direction == 'left' || p.direction == 'right'){ 
    									xmlItemEl.css({ display:'inline-block',textAlign:'right'});	
    									if(i > 0){ 
    										xmlItemEl.css({ width:strWrap.width()+xmlItemEl.width()});	
    									}
    								}
    								if(p.direction == 'down' || p.direction == 'up'){ 
    									xmlItemEl.css({ display:'block',textAlign:'left'});	
    										if(i > 0){ 
    											xmlItemEl.css({ paddingTop:strWrap.height()});
    										}
    								}
    								
    							}
    							code();
    						}
    					});
    				} else { 
    					code();
    				}
    				strWrap.data({ 
    					ini:code,
    					startheight: startHeight	
    				})
    				
    				
    				
    				
    			});
    		},
    		update: function () { 
    			var el = $(this);
    			var str_origin = $('.str_origin',el);
    			var str_move_clone = $('.str_move_clone',el);
    			str_origin.stop(true);
    			str_move_clone.remove();
    			el.data('ini')();
    		},
    		destroy: function () { 
    			
    			var el = $(this);
    			var elMove = $('.str_move',el);
    			var startHeight = el.data('startheight');
    			
    			$('.str_move_clone',el).remove();
    			el.off('mouseenter');
    			el.off('mousedown');
    			el.off('mouseup');
    			el.off('mouseleave');
    			el.off('mousemove');
    			el.removeClass('noStop').removeClass('str_vertical').removeClass('str_active').removeClass('no_drag').removeClass('str_static').removeClass('str_right').removeClass('str_down');
    			
    			var elStyle = el.attr('style'); 
    			if(elStyle){ 
    				var styleArr = elStyle.split(';');
    				for(var i=0; i < styleArr.length; i++){ 
    					var str = $.trim(styleArr[i]);
    					var tested =  str.search(/^height/g);
    					if(tested != -1){ 
    						styleArr[i] = '';	
    					}
    				}
    				var newArr = styleArr.join(';');
    				var newStyle =  newArr.replace(/;+/g,';')
    			
    				if(newStyle == ';'){ 
    					el.removeAttr('style');	
    				}else{ 
    					el.attr('style',newStyle);	
    				}
    				
    				if(startHeight){ 
    					el.css({ height:startHeight})	
    				}
    			}
    			elMove.stop(true);
    
    			if(elMove.length){ 
    				var context = elMove.html();
    				elMove.remove();
    				el.html(context);
    			}
    	
    		},
    		pause: function(){ 	
    			var el = $(this);
    			var elMove = $('.str_move',el);
    			elMove.stop(true);
    		}, 
    		play: function(){ 
    			var el = $(this);
    			$(this).off('mousemove');
    			el.data('moveF')();	
    		}
    		
    	};
    	$.fn.liMarquee = function (method) { 
    		if (methods[method]) { 
    			return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
    		} else if (typeof method === 'object' || !method) { 
    			return methods.init.apply(this, arguments);
    		} else { 
    			$.error('Метод ' + method + ' в jQuery.liMarquee не существует');
    		}
    	};
    })(jQuery);

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3d1ajE5MzU_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200606174730953.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3d1ajE5MzU=,size_16,color_FFFFFF,t_70