• 0

How can I transition Text?


Question

Hi everyone. I am working on a little website for myself and I wanted to transition a little bit of text through several different preset blocks of text at a set interval and I haven't been able to figure this out. So I figured I would post here and see if anyone knows how I can do this.

I am assuming I would need to do this through Javascript, but I wasn't sure. A lot of colleagues use old browsers so I can't really use html5 just yet.

Basically, I have the following text as an example and I want to change it every 10s or so.

"Polite and helpful"

"Available for your project"

"Reliable"

etc.

I'll probably have like 5 or 6 when I'm done.

Does anyone happen to know how this could be done? No matter what I search for online for this particular thing I get results for changing font color and stuff, not changing the actual text.

Thanks. :)

Link to comment
https://www.neowin.net/forum/topic/1152594-how-can-i-transition-text/
Share on other sites

5 answers to this question

Recommended Posts

  • 0

I believe this will work, just put your different phrases in li's or div's, whichever it works with.. it's fairly straight forward:

http://jquery.malsup.com/cycle/

Although I'd wait to see if anyone else comments, I think what you're wanting can be done in literally a few short lines of JS

  • 0

I believe this will work, just put your different phrases in li's or div's, whichever it works with.. it's fairly straight forward:

http://jquery.malsup.com/cycle/

Although I'd wait to see if anyone else comments, I think what you're wanting can be done in literally a few short lines of JS

Agree. Cycle should work fine for this.

  • 0

Thank you everyone. I will take a look at that. :) I was having a very hard time with this because all of the solutions that I found were for images but I couldn't find something that worked with text.

I really appreciate the help.

And @the better twin: Really nice site. :)

  • 0

Thank you everyone. I will take a look at that. :) I was having a very hard time with this because all of the solutions that I found were for images but I couldn't find something that worked with text.

I really appreciate the help.

And @the better twin: Really nice site. :)

Thanks its still a wip but slowly getting there.

Most of the solutions for image scrolling should work for text scrolling too as a lot of them scroll the content in div's or list items so you can put pretty much anything in there. That's what the testimonials on my site is like. its an image scroller without any images.

This topic is now closed to further replies.
  • Posts

    • This 4K webcam from Acer is now only $59.99 by Taras Buria Those looking for an affordable, high-resolution webcam from a reputable manufacturer can check out the latest deal from Acer, which puts its 4K webcam at a solid price. Thanks to a 14% discount, you can buy this all-metal 4K webcam from Acer for just $59.99. Despite the affordable price tag, the webcam has a pretty large 1/2" CMOS sensor manufactured by Sony. Apart from its size, it supports additional conveniences, such as high dynamic range and phase-detection autofocus (PDAF). Plus, the camera ensures you do not have to buy additional audio equipment, as it comes with two built-in high-sensitivity microphones, a built-in background noise filter, and the ability to pick up your voice from up to 2.5 meters away. Acer is not cheaping out on materials, and the webcam is enclosed in a more premium metal case, which is also good at heat dissipation (high-resolution cameras can get quite hot). And to make sure no one is peeping at you when the camera is in use, there is a magnetic cover also made of metal. Additional conveniences include an LED status indicator and a built-in mount that lets you place a camera on a tripod. Acer 4K Webcam for PC/Mac with All-Metal Unibody Sculpted - $59.99 | 14% off Good to know This Amazon deal is U.S.-specific and not available in other regions unless specified. We only use first-party seller links (at the time of article publishing); ensure that you purchase from a first-party seller link only. Check out Today's Deals on Amazon | or our recent tech deals. Become a Prime member (for Students or SNAP) via Neowin Get Prime Access - Prime for half price (for qualifying Medicaid, EBT, SNAP) Subscribe to Prime Video, Audible Plus, Music Unlimited, or Kindle Unlimited via Neowin As an Amazon Associate, we earn from qualifying purchases.
    • https://www.nvidia.com/en-us/g...back-thread-released-61626/ Best spot to find out if there are any issues b4 u deploy
    • Site is timing out for me.
    • Stop reporting AR glasses as an X inch screen, Y distance away. That is a horseshit meaningless spec. Report on the actual FOV angle. That's all that matters. And for the record, this FOV is ~49degrees. So we're talking about HoloLens level FOV... i.e. it's like looking through a piece of paper at arm's length.
    • I bought a 4TB Samsung 990 Pro for $250 brand new during Black Friday, to give some comparison. Things are getting absolutely ridiculous.
  • Recent Achievements

    • Conversation Starter
      NovaEdgeX earned a badge
      Conversation Starter
    • One Year In
      Console General earned a badge
      One Year In
    • One Year In
      Twozo Technologies earned a badge
      One Year In
    • One Month Later
      Twozo Technologies earned a badge
      One Month Later
    • Week One Done
      Twozo Technologies earned a badge
      Week One Done
  • Popular Contributors

    1. 1
      +primortal
      519
    2. 2
      +Edouard
      185
    3. 3
      PsYcHoKiLLa
      107
    4. 4
      Steven P.
      88
    5. 5
      ATLien_0
      67
  • Tell a friend

    Love Neowin? Tell a friend!