vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vB4 Design and Graphics Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=253)
-   -   CSS Keyframes (https://vborg.vbsupport.ru/showthread.php?t=328872)

Thr33 09-07-2021 05:20 PM

CSS Keyframes
 
I have been trying to get some CSS working but i've come to a hurdle where it works locally but not within vbulletin.

The code uses translate to animate the title so when it's too long for the container it will bounce left to right.

vBulletin 4.2.5

template: forumhome_forumbit_level2_post
Code:

<div class="radio-ani" style="color: {vb:raw sctrack.state};">{vb:raw sctrack.track}</div>
template: additional.css
Code:

.radio-ani {
  overflow: hidden;
  width: 15rem;
  white-space: nowrap;
}

.radio-ani > * {
  display: inline-block;
  position: relative;
  animation: 5s linear 0s infinite alternate move;
  box-sizing: border-box;
  padding: .8rem 1rem;
}

@keyframes move {
  0%,
  25% {
    transform: translateX(0%);
    left: 0%;
  }
  75%,
  100% {
    transform: translateX(-100%);
    left: 100%;
  }
}



All times are GMT. The time now is 02:31 PM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.00944 seconds
  • Memory Usage 1,706KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (2)bbcode_code_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (1)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 

Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete