The below Given code helps to create Breaking News Scrolling Widget using Script for Websites which provide flash news updates or Breaking News Updates.
Those who are freshers, Learners and experimenting on creating Webpages for News Websites and developing News Portals can use the code script to create the Widget.
The Code Script to be used in Body Part:
===========================================================================
<!-- outer-wrapper start -->
<div id='outer-wrapper'>
<div id='top-nav'>
<nav class='top-menu'>
<div id='beakingnews'><span class='tulisbreaking'>Breaking News</span>
<div id='recentpostbreaking'>Loading...</div></div>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
var url_blog = 'http://www.domainname.com/', // Replace With your Blog Url
numpostx = 20; // Maximum Post
$.ajax({
url: ''+url_blog+'/feeds/posts/default?alt=json-in-script&max-results=' + numpostx + '',
type: 'get',
dataType: "jsonp",
success: function(data) {
var posturl, posttitle, skeleton = '',
entry = data.feed.entry;
if (entry !== undefined) {
skeleton = "<ul>";
for (var i = 0; i < entry.length; i++) {
for (var j=0; j < entry[i].link.length; j++)
{
if (entry[i].link[j].rel == "alternate")
{
posturl = entry[i].link[j].href;
break;
}
}
posttitle = entry[i].title.$t;
skeleton += '<li><a href="' + posturl + '" target="_blank">' + posttitle + '</a></li>';
}
skeleton += '</ul>';
$('#recentpostbreaking').html(skeleton);
// kode untuk efek pada breaking news
function tick(){
$('#recentpostbreaking li:first').slideUp( function () { $(this).appendTo($('#recentpostbreaking ul')).slideDown(); });
}
setInterval(function(){ tick () }, 5000);
} else {
$('#recentpostbreaking').html('<span>No result!</span>');
}
},
error: function() {
$('#recentpostbreaking').html('<strong>Error Loading Feed!</strong>');
}
});
});
//]]>
</script>
==========================================================================
0 comments:
Post a Comment