Skip to content

Instantly share code, notes, and snippets.

@droidiser
Last active October 13, 2016 05:30
Show Gist options
  • Save droidiser/21d58644c2db6ceceddc to your computer and use it in GitHub Desktop.
Save droidiser/21d58644c2db6ceceddc to your computer and use it in GitHub Desktop.
<style scoped="" type="text/css">ul.drdsr-feat-posts *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}ul.drdsr-feat-posts{font:normal normal 11px Verdana,Geneva,sans-serif;width:300px;height:500px}ul.drdsr-feat-posts,ul.drdsr-feat-posts li{margin:0;padding:0;list-style:none;position:relative}ul.drdsr-feat-posts li{height:24.5%;position:absolute;padding:0;width:49.5%;float:left;overflow:hidden;display:none}ul.drdsr-feat-posts li:nth-child(1),ul.drdsr-feat-posts li:nth-child(2),ul.drdsr-feat-posts li:nth-child(3),ul.drdsr-feat-posts li:nth-child(4),ul.drdsr-feat-posts li:nth-child(5){display:block}ul.drdsr-feat-posts img{border:0;width:100%;height:100%}ul.drdsr-feat-posts li:nth-child(1){width:100%;height:49.5%;margin:0 0 2px;left:0;top:0}ul.drdsr-feat-posts li:nth-child(2){left:0;top:50%}ul.drdsr-feat-posts li:nth-child(3){left:50.5%;top:50%}ul.drdsr-feat-posts li:nth-child(4){left:0;top:75%}ul.drdsr-feat-posts li:nth-child(5){left:50.5%;top:75%}ul.drdsr-feat-posts .overlayx,ul.drdsr-feat-posts li{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out}ul.drdsr-feat-posts .overlayx{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;background-color:#000;color:#fff;-moz-opacity:.5;-khtml-opacity:.5;opacity:.5;text-align:justify;background-position:100% 50%;background-repeat:repeat-x}ul.drdsr-feat-posts ul.drdsr-feat-posts li:nth-child(1) .overlayx{background-position:50% 25%}ul.drdsr-feat-posts .overlayx:hover{-ms-filter:Alpha(Opacity=90);filter:alpha(opacity=90);-khtml-opacity:.5;-moz-opacity:.5;opacity:.5}ul.drdsr-feat-posts h4{position:absolute;bottom:30px;z-index:2;color:#fff;margin:0;width:100%;padding:0 10px;line-height:1.5em;font-family:"Segoe UI",Verdana,"Trebuchet MS",Times,"Times New Roman";font-weight:400;font-color:"Red"}li h4{font-size:110%}ul.drdsr-feat-posts li:nth-child(1) h4{font-size:200%}ul.drdsr-feat-posts .label_text{position:absolute;bottom:10px;left:10px;z-index:2;color:#fff;font-size:100%;font-color:#33b5e5}li:nth-child(2) .autname,li:nth-child(2) .label_text,li:nth-child(3) .autname,li:nth-child(3) .label_text,li:nth-child(4) .autname,li:nth-child(4) .label_text,li:nth-child(5) .autname,li:nth-child(5) .label_text{display:none}.buttons{margin:5px 0 0}.buttons a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative}.buttons a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #535353 transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50%}.buttons a.nextx::before{border-color:transparent transparent transparent #535353;margin-left:-3px}</style>
<div id="featuredpostside"></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script>
function FeaturedPostSide(a){(function(e){var h={blogURL:"",MaxPost:5,idcontaint:"",ImageSize:100,interval:5000,autoplay:false,loadingClass:"loadingxx",pBlank:"http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif",MonthNames:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],tagName:false};h=e.extend({},h,a);var g=e(h.idcontaint);var d=h.MaxPost*200;g.html('<div class="sliderx"><ul class="drdsr-feat-posts"></ul></div><div class="buttons"><a href="#" class="prevx">prev</a><a href="#" class="nextx">next</a></div>');var f=function(w){var q,k,m,u,x,p,t,v,r,l="",s=w.feed.entry;for(var o=0;o<s.length;o++){for(var n=0;n<s[o].link.length;n++){if(s[o].link[n].rel=="alternate"){q=s[o].link[n].href;break}}if("media$thumbnail" in s[o]){u=s[o].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+h.ImageSize+"-c")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.ImageSize+"$1")}k=s[o].title.$t;r=s[o].published.$t.substring(0,10);m=s[o].author[0].name.$t;x=r.substring(0,4);p=r.substring(5,7);t=r.substring(8,10);v=h.MonthNames[parseInt(p,10)-1];l+='<li><a target="_blank" href="'+q+'"><div class="overlayx"></div><img class="random" src="'+u+'"/><h4>'+k+'</h4></a><div class="label_text"><span class="date"><span class="dd">'+t+'</span> <span class="dm">'+v+'</span> <span class="dy">'+x+'</span></span> <span class="autname">'+m+"</span></div></li>"}e("ul",g).append(l).addClass(h.loadingClass)};var c=function(){e(h.idcontaint+" .nextx").click()};var b=function(){e.get((h.blogURL===""?window.location.protocol+"//"+window.location.host:h.blogURL)+"/feeds/posts/summary"+(h.tagName===false?"":"/-/"+h.tagName)+"?max-results="+h.MaxPost+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.idcontaint+" .prevx").click(function(){e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));return false});e(h.idcontaint+" .nextx").click(function(){e(h.idcontaint+" .sliderx li:last").after(e(h.idcontaint+" .sliderx li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));e(h.idcontaint+" .sliderx").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingClass)},d)};e(document).ready(b)})(jQuery)};
</script>
<script type='text/javascript'>
//<![CDATA[
FeaturedPostSide({
blogURL: "http://www.droidiser.com",
MaxPost: 12,
idcontaint: "#featuredpostside",
ImageSize: 200,
interval: 4000,
autoplay: true,
tagName: false
});
//]]>
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment