This topic contains 3 replies, has 2 voices, and was last updated by  Admin 3 months, 2 weeks ago.

Support Forums / Digitalsignagepress Questions

Scrolling Text

  • Author
    Posts
  • #6439 Reply

    Bryan

    Is there the possibility to implement “scrolling” text? Without shortcodes or similar?

  • #6440 Reply

    Admin
    Keymaster

    Yes:

    <!-- Styles -->    
    <style style="text/css">
    .example1 {
     height: 50px;    
     overflow: hidden;
     position: relative;
    }
    .example1 h3 {
    color: crimson;
    font-size: 200%;
     font-family: courier;
     position: absolute;
     width: 160%;
     height: 100%;
     margin: 0;
     line-height: 50px;
     text-align: center;
     /* Starting position */
     -moz-transform:translateX(100%);
     -webkit-transform:translateX(100%);    
     transform:translateX(100%);
     /* Apply animation to this element */    
     -moz-animation: example1 15s linear infinite;
     -webkit-animation: example1 15s linear infinite;
     animation: example1 50s linear infinite;
    }
    /* Move it (define the animation) */
    @-moz-keyframes example1 {
     0%   { -moz-transform: translateX(100%); }
     100% { -moz-transform: translateX(-100%); }
    }
    @-webkit-keyframes example1 {
     0%   { -webkit-transform: translateX(100%); }
     100% { -webkit-transform: translateX(-100%); }
    }
    @keyframes example1 {
     0%   { 
     -moz-transform: translateX(100%); /* Firefox bug fix */
     -webkit-transform: translateX(100%); /* Firefox bug fix */
     transform: translateX(100%);         
     }
     100% { 
     -moz-transform: translateX(-100%); /* Firefox bug fix */
     -webkit-transform: translateX(-100%); /* Firefox bug fix */
     transform: translateX(-100%); 
     }
    }
    </style>
    
    <!-- HTML -->    
    <div class="example1">
    <h3> Hello world!</h3>
    </div>
  • #8206 Reply

    Peter

    would this be possible to for RSS feeds.

  • #8314 Reply

    Admin
    Keymaster

    Not yet.

Reply To: Scrolling Text
Your information:




− 1 = 1