× İletişim Formu Renkli Son Yayınlanan Yayınlar Widget Tasarımı TRT Çocuk Çizgi Filmleri 3/20/2017 Etiketler : Blogger Widget TRT Çocuk Çizgi Filmleri <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script> <title>Kodeks Editör</title> <style type="text/css"> @import url(https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i); @import url(https://fonts.googleapis.com/icon?family=Material+Icons); body { background: #f3f5f6; color: #000; font-family: 'Roboto', sans-serif; font-size: 16px; line-height: 1.8; word-wrap: break-word; font-weight: 400; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased } .ux-featured { display: flex; margin: 8% auto 20px auto; width: 100%; overflow: hidden; max-width: 970px; box-shadow: 0 30px 10px -20px rgba(0, 0, 0, 0.2) } .ux-featureditem { background: rgba(0, 0, 0, 0.02); display: block; position: relative; float: left; overflow: hidden; height: 220px; width: 25% } .ux-featureditem .uxcontent { background: #3498db; display: block; position: absolute; z-index: 6; bottom: 0; left: 0; right: 0; transform: translate(0, 0); opacity: 1; visibility: visible; transition: all .3s } .ux-featureditem:hover .uxcontent { opacity: 0; visibility: hidden; transform: translate(0, 60px) } .ux-featureditem .uxcontent h3 { font-size: 14px; color: #fff; padding: 15px; margin: 0; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis } .ux-featureditem .feat-img { width: 100%; height: 100%; background-size: cover; background-position: 50% } .ux-featureditem a { display: block; color: rgba(255, 255, 255, 1); position: relative; vertical-align: bottom; z-index: 5; height: 100%; transition: all .3s } .ux-featureditem a:before { content: ''; background: #3498db; width: 100%; height: 100%; position: absolute; z-index: 3; top: 0; opacity: 0; transition: background 0.3s linear, opacity 0.3s linear } .ux-featureditem.first a:before, .ux-featureditem.first .uxcontent { background: #56a8df } .ux-featureditem.second a:before, .ux-featureditem.second .uxcontent { background: #e49148 } .ux-featureditem.third a:before, .ux-featureditem.third .uxcontent { background: #5bccb6 } .ux-featureditem.fourth a:before, .ux-featureditem.fourth .uxcontent { background: #f5b44c } .ux-featureditem a:hover:before { opacity: 0.9; } .ux-featureditem a:after { content: 'textsms'; font-family: Material Icons; position: absolute; z-index: 3; font-size: 3rem; top: 32%; left: 0; right: 0; bottom: 0; color: #fff; text-align: center; transform: translate(0, -60px); animation: jellygrav .6s linear; opacity: 0; visibility: hidden; transition: all .3s } .ux-featureditem:hover a:after { opacity: 1; visibility: visible; transform: translate(0, 0) } @media screen and (max-width:600px) { .ux-featureditem { width: 50% } .ux-featureditem.third, .ux-featureditem.fourth { display: none } } @media screen and (max-width:500px) { .ux-featureditem { width: 100% } .ux-featureditem.second, .ux-featureditem.third, .ux-featureditem.fourth { display: none } } </style> </head> <body> <div> <div class='ux-featureds' id='ux-featured'> <div class='widget-content'> [son] </div> </div> </div> <script type='text/javascript'> //<![CDATA[ // son Post function getPostUrl(a) { for (var b = 0; b < a.link.length; b++) if ("alternate" == a.link[b].rel) { var c = a.link[b].href; return c } } function getPostPublishDate(a) { var b = a.published.$t, c = b.split("-")[2].substring(0, 2), d = b.split("-")[1], e = b.split("-")[0], f = ["Ocak","Şubat","Mart","Nisan","Mayıs","Haziran","Temmuz","Ağustos","Eylül","Ekim","Kasım","Aralık"], g = f[d - 1], h = g + " " + c + ", " + e; return b ? h : "" } function getPostCategory(a) { var b = a.category; b && (b = a.category[0].term); var c = '<div class="category-wrapper"><a class="category" href="https://bloggereklentileri.blogspot.com/search/label/' + b + '?max-results=10">' + b + "</a></div>"; return b ? c : "" } function Slider(a) { for (var c = (new Array, ""), d = a.feed.entry.length, e = 0; e < d; e++) { var f = a.feed.entry[e], g = f.title.$t, h = getPostUrl(f), l = (f.author[0].name.$t, getPostPublishDate(f), getPostCategory(f), f.category[0].term), m = a.feed.entry[e].content.$t, n = $("<div>").html(m); if (m.indexOf("//www.youtube.com/embed/") > -1) var o = a.feed.entry[e].media$thumbnail.url, p = o; else if (m.indexOf("<img") > -1) var q = n.find("img:first").attr("src"), p = q; else var p = no_image; 0 == e && (c = c + '<div class="ux-featureditem first"><div class="uxcontent"><h3>' + g + '</h3></div><a href="' + h + '"><div class="feat-img" style="background-image:url(' + p + ');"></div></a></div>'), 1 == e && (c = c + '<div class="ux-featureditem second"><div class="uxcontent"><h3>' + g + '</h3></div><a href="' + h + '"><div class="feat-img" style="background-image:url(' + p + ');"></div></a></div>'), 2 == e && (c = c + '<div class="ux-featureditem third"><div class="uxcontent"><h3>' + g + '</h3></div><a href="' + h + '"><div class="feat-img" style="background-image:url(' + p + ');"></div></a></div>'), 3 == e && (c = c + '<div class="ux-featureditem fourth"><div class="uxcontent"><h3>' + g + '</h3></div><a href="' + h + '"><div class="feat-img" style="background-image:url(' + p + ');"></div></a></div>') } slider.html('<div class="ux-featured">' + c + "</div>"), $(".ux-featured").find(".feat-img").each(function() { $(this).attr("style", function(a, b) { return b.replace("/default.jpg", "/mqdefault.jpg") }).attr("style", function(a, b) { return b.replace("s72-c", "s1600") }).attr("style", function(a, b) { return b.replace("s320", "s1600") }).attr("style", function(a, b) { return b.replace("s400", "s1600") }).attr("style", function(a, b) { return b.replace("s640", "s1600") }) }) } var slider = $("#ux-featured .widget-content"), sliderContent = slider.text().trim(); "no" !== sliderContent.toLowerCase().trim() && '"no"' !== sliderContent.toLowerCase() && "" !== sliderContent ? "[son]" !== sliderContent ? $.ajax({ url: "https://bloggereklentileri.blogspot.com/feeds/posts/default/-/" + sliderContent + "?alt=json-in-script&max-results=4", type: "get", dataType: "jsonp", success: function(a) { Slider(a) } }) : $.ajax({ url: "https://bloggereklentileri.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=4", type: "get", dataType: "jsonp", success: function(a) { Slider(a) } }) : $("#slider").remove(); //]]> </script> </body> </html> YENİ YAYIN ÖNCEKİ YAYIN "Renkli Son Yayınlanan Yayınlar Widget Tasarımı" 0 Yorum yapıldı. Yorum Gönder Sonraki Kayıt Ana Sayfa Kaydol: Kayıt Yorumları (Atom) ×
Renkli Son Yayınlanan Yayınlar Widget Tasarımı TRT Çocuk Çizgi Filmleri 3/20/2017 Etiketler : Blogger Widget TRT Çocuk Çizgi Filmleri <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script> <title>Kodeks Editör</title> <style type="text/css"> @import url(https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i); @import url(https://fonts.googleapis.com/icon?family=Material+Icons); body { background: #f3f5f6; color: #000; font-family: 'Roboto', sans-serif; font-size: 16px; line-height: 1.8; word-wrap: break-word; font-weight: 400; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased } .ux-featured { display: flex; margin: 8% auto 20px auto; width: 100%; overflow: hidden; max-width: 970px; box-shadow: 0 30px 10px -20px rgba(0, 0, 0, 0.2) } .ux-featureditem { background: rgba(0, 0, 0, 0.02); display: block; position: relative; float: left; overflow: hidden; height: 220px; width: 25% } .ux-featureditem .uxcontent { background: #3498db; display: block; position: absolute; z-index: 6; bottom: 0; left: 0; right: 0; transform: translate(0, 0); opacity: 1; visibility: visible; transition: all .3s } .ux-featureditem:hover .uxcontent { opacity: 0; visibility: hidden; transform: translate(0, 60px) } .ux-featureditem .uxcontent h3 { font-size: 14px; color: #fff; padding: 15px; margin: 0; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis } .ux-featureditem .feat-img { width: 100%; height: 100%; background-size: cover; background-position: 50% } .ux-featureditem a { display: block; color: rgba(255, 255, 255, 1); position: relative; vertical-align: bottom; z-index: 5; height: 100%; transition: all .3s } .ux-featureditem a:before { content: ''; background: #3498db; width: 100%; height: 100%; position: absolute; z-index: 3; top: 0; opacity: 0; transition: background 0.3s linear, opacity 0.3s linear } .ux-featureditem.first a:before, .ux-featureditem.first .uxcontent { background: #56a8df } .ux-featureditem.second a:before, .ux-featureditem.second .uxcontent { background: #e49148 } .ux-featureditem.third a:before, .ux-featureditem.third .uxcontent { background: #5bccb6 } .ux-featureditem.fourth a:before, .ux-featureditem.fourth .uxcontent { background: #f5b44c } .ux-featureditem a:hover:before { opacity: 0.9; } .ux-featureditem a:after { content: 'textsms'; font-family: Material Icons; position: absolute; z-index: 3; font-size: 3rem; top: 32%; left: 0; right: 0; bottom: 0; color: #fff; text-align: center; transform: translate(0, -60px); animation: jellygrav .6s linear; opacity: 0; visibility: hidden; transition: all .3s } .ux-featureditem:hover a:after { opacity: 1; visibility: visible; transform: translate(0, 0) } @media screen and (max-width:600px) { .ux-featureditem { width: 50% } .ux-featureditem.third, .ux-featureditem.fourth { display: none } } @media screen and (max-width:500px) { .ux-featureditem { width: 100% } .ux-featureditem.second, .ux-featureditem.third, .ux-featureditem.fourth { display: none } } </style> </head> <body> <div> <div class='ux-featureds' id='ux-featured'> <div class='widget-content'> [son] </div> </div> </div> <script type='text/javascript'> //<![CDATA[ // son Post function getPostUrl(a) { for (var b = 0; b < a.link.length; b++) if ("alternate" == a.link[b].rel) { var c = a.link[b].href; return c } } function getPostPublishDate(a) { var b = a.published.$t, c = b.split("-")[2].substring(0, 2), d = b.split("-")[1], e = b.split("-")[0], f = ["Ocak","Şubat","Mart","Nisan","Mayıs","Haziran","Temmuz","Ağustos","Eylül","Ekim","Kasım","Aralık"], g = f[d - 1], h = g + " " + c + ", " + e; return b ? h : "" } function getPostCategory(a) { var b = a.category; b && (b = a.category[0].term); var c = '<div class="category-wrapper"><a class="category" href="https://bloggereklentileri.blogspot.com/search/label/' + b + '?max-results=10">' + b + "</a></div>"; return b ? c : "" } function Slider(a) { for (var c = (new Array, ""), d = a.feed.entry.length, e = 0; e < d; e++) { var f = a.feed.entry[e], g = f.title.$t, h = getPostUrl(f), l = (f.author[0].name.$t, getPostPublishDate(f), getPostCategory(f), f.category[0].term), m = a.feed.entry[e].content.$t, n = $("<div>").html(m); if (m.indexOf("//www.youtube.com/embed/") > -1) var o = a.feed.entry[e].media$thumbnail.url, p = o; else if (m.indexOf("<img") > -1) var q = n.find("img:first").attr("src"), p = q; else var p = no_image; 0 == e && (c = c + '<div class="ux-featureditem first"><div class="uxcontent"><h3>' + g + '</h3></div><a href="' + h + '"><div class="feat-img" style="background-image:url(' + p + ');"></div></a></div>'), 1 == e && (c = c + '<div class="ux-featureditem second"><div class="uxcontent"><h3>' + g + '</h3></div><a href="' + h + '"><div class="feat-img" style="background-image:url(' + p + ');"></div></a></div>'), 2 == e && (c = c + '<div class="ux-featureditem third"><div class="uxcontent"><h3>' + g + '</h3></div><a href="' + h + '"><div class="feat-img" style="background-image:url(' + p + ');"></div></a></div>'), 3 == e && (c = c + '<div class="ux-featureditem fourth"><div class="uxcontent"><h3>' + g + '</h3></div><a href="' + h + '"><div class="feat-img" style="background-image:url(' + p + ');"></div></a></div>') } slider.html('<div class="ux-featured">' + c + "</div>"), $(".ux-featured").find(".feat-img").each(function() { $(this).attr("style", function(a, b) { return b.replace("/default.jpg", "/mqdefault.jpg") }).attr("style", function(a, b) { return b.replace("s72-c", "s1600") }).attr("style", function(a, b) { return b.replace("s320", "s1600") }).attr("style", function(a, b) { return b.replace("s400", "s1600") }).attr("style", function(a, b) { return b.replace("s640", "s1600") }) }) } var slider = $("#ux-featured .widget-content"), sliderContent = slider.text().trim(); "no" !== sliderContent.toLowerCase().trim() && '"no"' !== sliderContent.toLowerCase() && "" !== sliderContent ? "[son]" !== sliderContent ? $.ajax({ url: "https://bloggereklentileri.blogspot.com/feeds/posts/default/-/" + sliderContent + "?alt=json-in-script&max-results=4", type: "get", dataType: "jsonp", success: function(a) { Slider(a) } }) : $.ajax({ url: "https://bloggereklentileri.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=4", type: "get", dataType: "jsonp", success: function(a) { Slider(a) } }) : $("#slider").remove(); //]]> </script> </body> </html>
Yorum Gönder