Videos

    .vid-item .desc {
        color: #888;  /* <-- color of titles in playlist */
    }
    .vid-item:hover .desc {
        color: #439DDE;  /* <-- hover state color of titles */
    }
    .current-vid {
        /*color: #fff !important;*/  /* <-- color of title for currently selected video */
    }
    .mlvp-arrow-left, .mlvp-arrow-right {
        color: #999;  /* <-- color of playlist arrows */
    }
    .mlvp-arrow-left:hover, .mlvp-arrow-right:hover {
        color: #213143;  /* <-- hover color of playlist arrows */
    }


<!-- MyList Gallery SETTINGS -->

    var playListID = ["PLSSPBo7OVSZsthvEQhtu2sZ1G9GUAnnZ7", "PLSSPBo7OVSZu820GHiO3qjYRT2oL2V9wM", "PLSSPBo7OVSZszs6coWD3nnAhJyVe_2drG"];
    var apiKey = "AIzaSyBMRyIdlgyAKIoKe9ptUZgejHZQB3RWumY";
    var autoPlayNext = 1;
    var showPlayerControls = 1;
    var showVideoInfo = 0;
    var showRelatedVideos = 0;
    var showTitlesInList = 1;


  • Image 01
  • Image 02
  • Image 03
</div>
<!--

Add multiple YouTube playlists to create a responsive video gallery

-->

Responsive YouTube Video Gallery with Scrolling Thumbnail Playlists

Easily add multiple YouTube playlists to create a responsive video gallery

Videos open in a full-screen HTML5 YouTube player

</div> </div> </div>

GoPro: Hello Winter!

</div>
</div> </div>

GoPro: Animals

</div>
</div> </div>

GoPro: Music

</div>
</div> </div> <!-- THE YOUTUBE PLAYER -->
Stop video and close
</div> </div> </div>


http://mylist-gallery/js/mylist-player.js

  $(document).ready(function() {

        // banner slideshow
        function fadeInOut () {
            $('.cb-slideshow li:nth-child(3) span').delay(6000).fadeOut(1000, function () {
                $('.cb-slideshow li:nth-child(2) span').delay(6000).fadeOut(1000, function () {
                    $('.cb-slideshow li:nth-child(3) span').delay(6000).fadeIn(1000, function () {
                        $('.cb-slideshow li:nth-child(2) span').fadeIn(10);
                        setTimeout(fadeInOut, 500);
                    });
                });
            });
        }
        fadeInOut();

        function scrollin() {
            $('.tag p:nth-child(3)').animate({marginLeft: "-100px"},0);
            $('.tag p:first-child').animate({marginLeft:"0", opacity: "1"},1000, function() {
                $('.tag p:first-child').delay(6000).animate({opacity: "0"},1000);
                $('.tag p:nth-child(2)').delay(6000).animate({marginLeft:"0", opacity: "1"},1000, function() {
                    $('.tag p:first-child').animate({marginLeft: "-100px"},0);
                    $('.tag p:nth-child(2)').delay(6000).animate({opacity: "0"},1000);
                    $('.tag p:nth-child(3)').delay(6000).animate({marginLeft:"0", opacity: "1"},1000, function() {
                        $('.tag p:nth-child(2)').animate({marginLeft: "-100px"},0);
                        $('.tag p:nth-child(3)').delay(6000).animate({opacity: "0"},1000);
                        setTimeout(scrollin, 6500);
                    });
                });
            });
        }
        scrollin();


        // smooth scroll to anchor
        $('a[href^="#"]').on('click',function (e) {
            e.preventDefault();

            var target = this.hash;
            var $target = $(target);

            $('html, body').stop().animate({
                'scrollTop': $target.offset().top
            }, 600, 'swing', function () {
                window.location.hash = target;
            });
        });
  });


<!-- parallax -->
<a href="http://www.woosterwebdesign.com/lhmarchitects/theme/Wooster/js/jquery.stellar.min.js">http://www.woosterwebdesign.com/lhmarchitects/theme/Wooster/js/jquery.stellar.min.js</a>


    var isMobile = {
        Android: function() {
            return navigator.userAgent.match(/Android/i);
        },
        BlackBerry: function() {
            return navigator.userAgent.match(/BlackBerry/i);
        },
        iOS: function() {
            return navigator.userAgent.match(/iPhone|iPad|iPod/i);
        },
        Opera: function() {
            return navigator.userAgent.match(/Opera Mini/i);
        },
        Windows: function() {
            return navigator.userAgent.match(/IEMobile/i);
        },
        any: function() {
            return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
        }
    };

    if( !isMobile.any() ) {
      console.log("not mobile");
          $(function(){
            $.stellar({
              horizontalScrolling: false,
              verticalOffset: 0
            });
          });
        }
    else {
      console.log("mobile");
      // $(".hdr").addClass("fixed");
    }




    function showL() {
        $( ".modal" ).addClass( "show" );
        $( ".over" ).addClass( "show" );
    }
    function hideL() {
        $( ".modal" ).removeClass( "show" );
        $( ".over" ).removeClass( "show" );
    }
    function showS() {
        $( ".modal-support" ).addClass( "show" );
        $( ".over" ).addClass( "show" );
    }
    function hideS() {
        $( ".modal-support" ).removeClass( "show" );
        $( ".over" ).removeClass( "show" );
    }

via Blogger http://www.droidadda.org/2017/06/videos_22.html http://ifttt.com/images/no_image_card.png

Advertisements

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s