Blogspot সাইটের জন্য News Feed Ticker - নতুন CSS3 animated ডিজাইন

আসসালামু আলাইকুম,
আপনাদের ব্লগস্পট সাইটের জন্য আজ নিয়ে এলাম আরেকটা উইজেট। এটা ৭০ শতাংশ আমার ডিজাইন করা।
এখানে আপনি টিকার হেডার এবং স্টাইল চেঞ্জ করতে পারবেন।
হোভার অ্যানিমেশন আছে। ট্রাঞ্জিশন ইফেক্টের জন্য আরও সুন্দর দেখায়।
বুলেট ক্যারেক্টারে একটা ছোট ইমেজ আছে, সেখানে আপনার সাইটের লোগোর লিঙ্ক দিয়ে দেবেন।
হোভার

নরমাল


কোডঃ
<style>
table.tickeer{
border-radius: 5px;
background: limegreen;
width: 70%;
box-shadow: 2px 2px 2px black;
text-align: center;
transition: 3s;
}
table:hover.tickeer{
background: white;
transition: 0.96s;
}
td.tuppp{
border-radius: 5px;
font-family: calibri;
color: white;
width: 20%;
display: block;
font-size: 1.1em;
font-weight: bold;
text-transform: uppercase;
padding: 10px 15px;
margin: 20px auto;
background-color: lime;
background: -webkit-linear-gradient(#888, #555);
background: linear-gradient(#7aeb0c, #529d09);
border: 0 none;
text-shadow: 0 -1px 0 #000;
cursor: pointer;
text-shadow: 2px 2px 2px black;
text-decoration: none;
transition: 2s;
}
td:hover.tuppp{
box-shadow: 0 1px 0 #666, 0 5px 0 #444, 0 6px 6px rgba(0,0,0,0.6);
transition: 2s;
}
.news {
width:100%;
margin:0 auto;
padding:0 2px;
line-height: 1.4em;
text-align:left;
font:normal 580px siyam rupali;
color:#ff0000;
overflow:hidden;
clear:both;
}
.news a:link, .news a:visited{
color:#ff0000;
text-decoration:none;
}
.news a:hover {
color:#000000;
text-decoration:underline;
}
</style>
<center>
<table class="tickeer">
<tr>
<td class="tuppp">GR+ News Update</td>
<marque>
<td>
<script type='text/javascript'>
var nMaxPosts = 30;
var nWidth = 100;
var nScrollDelay = 20;
var sDirection = "left";
var sOpenLinkLocation= "newtab" ;
var sBulletChar = "<img src='https://2.bp.blogspot.com/-mDAMZmxoo0Q/VuAixSKYbcI/AAAAAAAACjY/eKc7OAZpPvk/s1600/Green%2BRanzers%2BPlus%2BStylish.png' height='25px' width='30px' >";
</script>
<script type='text/javascript' src="https://googledrive.com/host/0Bz8X6FgnifH3VEZTNjJ2YXpkS28">
</script>
<script type="text/javascript" src="http://grplusbd.blogspot.com/feeds/posts/default?alt=json-in-script&amp;callback=RecentPostsScrollerv2&amp;max-results=30 " ></script>
</td>
</marque></tr>
</table>
</center>

ডেমোঃ
GR+

শেয়ার করুন

লেখকঃ

আমি তাওসিফ তুরাবি, অনলাইনাম (অনলাইন + নাম) ব্লগার তাওসিফ। এখন, ২০১৬ পর্যন্ত আমি ১৬ বছরের এক কিশোর। পড়াশোনা করি শহীদ পুলিশ স্মৃতি কলেজে। টেক ব্লগ লিখতে ভালবাসি। সাইন্স ফিকশন আর গল্প লিখতে পছন্দ করি।  জিআর+ ব্লগের এর একজন প্রতিষ্ঠাতা অ্যাডমিন।
আমাদের একটা ওয়েব ডেভেলপার ফার্ম আছে যার নাম জিআর+ আইটি বাংলাদেশ
এছাড়া আমার ব্যাক্তিগত ব্লগ রয়েছে। আমার ফেসবুক আইডিতে আমার সাথে সর্বক্ষণ যোগাযোগ করতে পারবেন। 


পূর্ববর্তী পোষ্ট
পরবর্তী পোষ্ট