Simple News Ticker using JQuery Plugin


Easy Ticker is a jQuery plugin helps you create a highly customizable, cross browser, flexible and infinite news ticker on your web page.

Full Source Code :

<!doctype html>
    <meta charset="utf-8">
    <title>Simple News Ticker using JQuery Plugin</title>
    <style type="text/css">
        text-align: center;
        margin:0 auto;
        border: 1px solid #ccc;
      .ticker-wrapper ul {
        padding: 0;
        list-style: none;
      .ticker-wrapper img {
        float: left;
        width: 177px;
        margin: 5px 15px 0 0;
      .ticker-wrapper a {
        font-family: Arial, sans-serif;
        font-size: 20px;
        font-weight: bold;
        text-decoration: none;
        color: #da7f22;
      .ticker-wrapper p {
        margin: 15px 0 0;
        font-size: 16px;
        line-height: 28px;
      .ticker-wrapper li:after {
        content: '';
        display: block;
        clear: both;
      .ticker-wrapper li {
        padding: 20px;
        border-bottom: 1px dashed #ccc;


    $newslist = array(
        'title'=>'Zoom Meeting : Is it really safe and deserves to be used ?',
        'summary'=>'Coronavirus (Covid-19) pandemic has changed our lives drastically as every one of us is in our home quarantine.'
        'title'=>'New crypto currency in market : Is PI network legit ?',
        'summary'=>'Currency and the means of exchange has evolved and changed from the beginning of human beings. the 21st century is a digital world which needs a digital currency.'
        'title'=>'Everything you need to know about Sagoon',
        'summary'=>'We are living in the world of digitalization and modernization where people have moved to the next level of technology in every sector. Similarly, social commerce platforms have dramatically changed.'
        'title'=>'What Does The Future Hold For Crypto-Currency ?',
        'summary'=>'The world is moving towards modernization and development at a quick pace. We can see many development works and evolution in every sector of our lives.'

    <h1 class="title">News Ticker Plugin</h1>
    <div class="ticker-wrapper">
        <?php foreach($newslist as $news){?>
            <img src="<?php echo $news['image'];?>">
            <a href="#"><?php echo $news['title'];?></a>
            <p><?php echo $news['summary'];?></p>
        <?php } ?>

    <script src=""></script> 
    <script src=""></script>

    <script type="text/javascript">
        direction: 'up',
        easing: 'swing',
        visible: 3,



ALSO READ  Best way to use Google Analytics (GA4) Realtime API with PHP

Comments are closed.