Java script to place a countdown timer on the screen that stays fixed when participants scroll down | XM Community
Solved

Java script to place a countdown timer on the screen that stays fixed when participants scroll down

  • 7 June 2018
  • 3 replies
  • 117 views
A
I had some Java script that achieved this on an old survey that I cannot access anymore. By inspecting the element, I managed to find this code but it doesn't work in a new survey. I do not know Java script and do not know how to get it to work.

Anyone know what's wrong with this code?

“>.banner {\\nbackground-color: red;\\npadding: 3px;\\nborder: 5px black;\\nheight:20px;\\nwidth:80px;\\nmargin-left: 775px;\\nposition:fixed;\\ntext-align:center;\\n}\\n<style>\\n<div class=\\”banner\\”><strong>Tme: <span id=\\”time\\”>60</span> <script>\\n started = false;\\n function countdown ()\\n {\\n if (!started)\\n started = true;\\n else\\n {\\n var value = parseInt($(‘time’).
icon

Best answer by Matt_Christie_Walker 13 June 2018, 05:24

View original

3 replies

Matt_Christie_Walker
Rank
Userlevel 4
Badge +5
If you haven't done so already, take a few minutes to read up on the Timer Question. Specifically, there is an option to Show Timer. Depending on your reasons for needing a timer, this out of the box approach may simplify things.

By default the timer doesn't lock into place, but we could probably fix that with a bit of custom css.
A
Hi Matt, thanks for getting back to me. Yes the countdown timer is ideal, but it does not stay fixed on the page. Know of any code to enable this?
Matt_Christie_Walker
Rank
Userlevel 4
Badge +5
You could use something like this:

.FlipClock {
background-color: #333;
padding: 2px;
border-radius: 2px;
margin: 10px auto;
float: left;
box-shadow: 0 1px 3px rgba(0,0,0,.5);
position: fixed;
top: 0;
left: 0;
}

Place this as custom CSS within the Survey's "Look and Feel" menu. Modify as desired. That should get you going at least.

Leave a Reply


Terms & Conditions