List of *.jpg to hover rotating thumbnail jquery

Trying to make image thumbnail autoplay hover for site for life of me i cant get this to work it already has a thumbnail hover on certain parts of the original image but that sucks.

Source of Site of image https://www.porntrex.com/categories/teen/

<div class="video-preview-screen video-item thumb-item  " data-item-id="1326457">
   <a href="https://www.porntrex.com/video/1326457/dadcrush-vanessa-sky-rebellious-daughter2" class="thumb rotator-screen">
      <img class="cover lazyloaded" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/1.jpg?v=3" alt="DadCrush - Vanessa Sky - Rebellious Daughter" src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/1.jpg?v=3">
      <ul class="screenshots-list">
         <li class="screenshot-item active" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/1.jpg?v=3"></li>
         <li class="screenshot-item" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/2.jpg?v=3"></li>
         <li class="screenshot-item" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/3.jpg?v=3"></li>
         <li class="screenshot-item" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/4.jpg?v=3"></li>
         <li class="screenshot-item" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/5.jpg?v=3"></li>
         <li class="screenshot-item" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/6.jpg?v=3"></li>
         <li class="screenshot-item" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/7.jpg?v=3"></li>
         <li class="screenshot-item" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/8.jpg?v=3"></li>
         <li class="screenshot-item" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/9.jpg?v=3"></li>
         <li class="screenshot-item" data-src="//statics.cdntrex.com/contents/videos_screenshots/1326000/1326457/300x168/10.jpg?v=3"></li>
      </ul>
   </a>
   <span class="ico-fav-0 " title="Add to Favourites" data-fav-video-id="1326457" data-fav-type="0"></span><span class="ico-fav-1 " title="Watch Later" data-fav-video-id="1326457" data-fav-type="1"></span>
   <div class="hd-text-icon text video-item-submitted"><span class="quality">1080p</span> <span class="hd-icon">HD</span></div>
   <div class="viewsthumb">13 views</div>
   <div class="durations"><i class="fa fa-clock-o"></i> 52:06</div>
   <p class="inf"><a href="https://www.porntrex.com/video/1326457/dadcrush-vanessa-sky-rebellious-daughter2" title="DadCrush - Vanessa Sky - Rebellious Daughter">DadCrush - Vanessa Sky - Rebellious Daughter</a></p>
   <ul class="list-unstyled">
      <li>1 hour ago</li>
      <li class="pull-right"><i class="fa fa-thumbs-o-up"></i> 0%</li>
   </ul>
</div>

My Tampermonkey

// @name         New Userscript
// @namespace    http://tampermonkey.net/
// @include https://www.porntrex.com/categories/*
// @version      0.1
// @description  try to take over the world!
// @author       You
// @grant        none
// ==/UserScript==

$(document).ready(function(){

 $('a.thumb.rotator-screen').click(function(){
  loadAndPlayVideo( $(this).find('img').attr('class').replace(/cover lazyloaded/,'') );
  return false;
 })

 var timer,
  count = 0,
  cycle = function(el){
    var s = el.attr('src'),
     root = s.substring( 0, s.lastIndexOf('/') + 1 );
    count = (count+1)%4;
    el.attr('src', root + ((count==0) ? 'default' : count) + '.jpg?v=3');
 };

 $('.video-preview-screen.video-item.thumb-item img').hover(function(){
   var $this = $(this);
   cycle($this);
   timer = setInterval(function(){ cycle($this); }, 1000);
 }, function(){
   clearInterval(timer);
 });

})


Read more here: https://stackoverflow.com/questions/64398756/list-of-jpg-to-hover-rotating-thumbnail-jquery

Content Attribution

This content was originally published by Tyler Haupert at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: