https://www.cfkargentina.com/video/index.html

1<!DOCTYPE html>
2<html>
3<head>
4  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5<title></title>
6  
7  

7<script type='text/javascript' src="https://code.jquery.com/jquery-1.5.2.js"></script>

7
8
9  
10<style type='text/css'>
11    #player {
12	width: 696px;
13	height: 320px;
14	overflow: hidden;
15	background: gray;
16	position: absolute;
17	border: 2px solid #FFF;
18	background-color: #FFFFFF;
19}
20
21body {
22	width: 696;
23	background-color:#FFF;
24	margin-right:auto;
25	margin-left:auto;
26	background-repeat: no-repeat;
27	background-position: -180px top;
28	background-image: url(channels4_banner.jpg);
29}
30.youtube .carousel {
31    width: 20%;
32    height: 100%;
33    overflow: auto;
34    position: absolute;
35    right: 0px;
36    z-index: 3;
37}
38
39.youtube .thumbnail {
40    margin: 2px;
41    width: 80%;
42    border: 1px solid black;  
43}
44
45.youtube iframe.player {
46    width: 80%;
47    height: 320px;  
48    overflow: auto;
49    border: 0;
50}
51
52  .box {
53	height: 330px;
54	width: 700px;
55	margin-top: 170px;
56}
57
58</style>
59  
60</head>
61<body>
62
63<div class="box">
64<div id="player">
65</div>
66</div>
67 
68  
69
70

71<script type='text/javascript'>//<![CDATA[ 
72
73/*
74Copyright 2011 : Simone Gianni <[email protected]>
75
76Released under The Apache License 2.0 
77http://www.apache.org/licenses/LICENSE-2.0
78
79*/
80
81(function() {
82    function createPlayer(jqe, video, options) {
83        var ifr = $('iframe', jqe);
84        if (ifr.length === 0) {
85            ifr = $('<iframe scrolling="no">');
86            ifr.addClass('player');
87        }
88        var src = 'http://www.youtube.com/embed/' + video.id;
89        if (options.playopts) {
90            src += '?';
91            for (var k in options.playopts) {
92                src+= k + '=' + options.playopts[k] + '&';
93            }  
94            src += '_a=b';
95        }
96        ifr.attr('src', src);
97        jqe.append(ifr);  
98    }
99    
100    function createCarousel(jqe, videos, options) {
101        var car = $('div.carousel', jqe);
102        if (car.length === 0) {
103            car = $('<div>');
104            car.addClass('carousel');
105            jqe.append(car);
106            
107        }
108        $.each(videos, function(i,video) {
109            options.thumbnail(car, video, options); 
110        });
111    }
112    
113    function createThumbnail(jqe, video, options) {
114        var imgurl = video.thumbnails[0].url;
115        var img = $('img[src="' + imgurl + '"]');
116        if (img.length !== 0) return;
117        img = $('<img>');    
118        img.addClass('thumbnail');
119        jqe.append(img);
120        img.attr('src', imgurl);
121        img.attr('title', video.title);
122        img.click(function() {
123            options.player(options.maindiv, video, $.extend(true,{},options,{playopts:{autoplay:1}}));
124        });
125    }
126    
127    var defoptions = {
128        autoplay: false,
129        user: null,
130        carousel: createCarousel,
131        player: createPlayer,
132        thumbnail: createThumbnail,
133        loaded: function() {},
134        playopts: {
135            autoplay: 0,
136            egm: 1,
137            autohide: 1,
138            fs: 1,
139            showinfo: 0
140        }
141    };
142    
143    
144    $.fn.extend({
145        youTubeChannel: function(options) {
146            var md = $(this);
147            md.addClass('youtube');
148            md.addClass('youtube-channel');
149            var allopts = $.extend(true, {}, defoptions, options);
150            allopts.maindiv = md;
151            $.getJSON('http://gdata.youtube.com/feeds/users/' + allopts.user + '/uploads?alt=json-in-script&format=5&callback=?', null, function(data) {
152                var feed = data.feed;
153                var videos = [];
154                $.each(feed.entry, function(i, entry) {
155                    var video = {
156                        title: entry.title.$t,
157                        id: entry.id.$t.match('[^/]*$'),
158                        thumbnails: entry.media$group.media$thumbnail
159                    };
160                    videos.push(video);
161                });
162                allopts.allvideos = videos;
163                allopts.carousel(md, videos, allopts);
164                allopts.player(md, videos[0], allopts);
165                allopts.loaded(videos, allopts);
166            });
167        } 
168    });
169    
170})();
171        
172$(function() {
173    $('#player').youTubeChannel({user:'VideosCFKArgentina'});
174});
175//]]>  
176
177</script>

177
178
179

180<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"35685536f9004c599253c26bbcd48e2d","r":1,"spa":2}' crossorigin="anonymous"></script>

180
181</body>
182
183
184</html>
185
186