Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Search the Community

Showing results for tags 'countdown'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers 🇫🇷's Topics
  • France Designers 🇫🇷's Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location


Badges

Found 5 results

  1. My countdown counter is messing up my font size. My coding skills are limited, but if I interpret the code right, I think there's CSS inside javascript, and the CSS makes the counter number size as 40 px. It does however seem to be messing up with the fonts that follow. How could I make it more selective so that it would only be applied to the counter number font size? (This snippet: p { text-align: center; font-size: 40px; margin-top: 0px; }) Thanks in advance for any input. // Set the date we're counting down to var countDownDate = new Date("Aug 21, 2020 00:00:00").getTime(); // Update the count down every 1 second var x = setInterval(function() { // Get today's date and time var now = new Date().getTime(); // Find the distance between now and the count down date var distance = countDownDate - now; // Time calculations for days, hours, minutes and seconds var days = Math.floor(distance / (1000 * 60 * 60 * 24)); var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); var seconds = Math.floor((distance % (1000 * 60)) / 1000); // Output the result in an element with id="demo" document.getElementById("demo").innerHTML = days + " d " + hours + " : " + minutes + " : " + seconds + ""; // If the count down is over, write some text if (distance < 0) { clearInterval(x); document.getElementById("demo").innerHTML = "We are live!"; } }, 1000); p { text-align: center; font-size: 40px; margin-top: 0px; } <!DOCTYPE HTML> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <p id="demo"></p> </body>
  2. Site URL: https://elbuhololava.quarespace.com Im using the following code. The intentions is to show a kind of visits to the page. But i want it to increase over time, lets say, add 5 every day. can you help me?? www.elbuhololava.quarespace.com Password "elbuho". Thanks!! <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script> var a = 0; $(window).scroll(function() { var oTop = $('#counter').offset().top - window.innerHeight; if (a == 0 && $(window).scrollTop() > oTop) { $('.counter-value').each(function() { var $this = $(this), countTo = $this.attr('data-count'); $({ countNum: $this.text() }).animate({ countNum: countTo }, { duration: 2000, easing: 'swing', step: function() { $this.text(Math.floor(this.countNum)); }, complete: function() { $this.text(this.countNum); } }); }); a = 1; } }); </script> <div id="counter"> <div class="sqs-col sqs-col-4 counter-value" data-count="163" data-desc=" Autos Lavados">0</div> <style> .counter-value { font-size: 50px; line-height:1.4em; text-align:center; padding:18px 0; } .counter-value:after { content: attr(data-desc); display:block; text-transform:uppercase; font-size: 20px; line-height:1.3em; } <div id="counter" data-startdate="31/12/2010"> <div class="sqs-col sqs-col-4 counter-value" data-dailyincrement="2" data-count="200" data-desc=" Autos Lavados">0</div> </div> </style>
  3. Site URL: https://www.elbuhololava.com/ Site URL: https://elbuhololava.quarespace.com Password: pablobigotes Im using the following code. The intentions is to show a kind of visits to the page. But i want it to increase over time, lets say, add 5 every day. can you help me?? www.elbuhololava.quarespace.com Password "pablobigotes". Thanks!! <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script> var a = 0; $(window).scroll(function() { var oTop = $('#counter').offset().top - window.innerHeight; if (a == 0 && $(window).scrollTop() > oTop) { $('.counter-value').each(function() { var $this = $(this), countTo = $this.attr('data-count'); $({ countNum: $this.text() }).animate({ countNum: countTo }, { duration: 2000, easing: 'swing', step: function() { $this.text(Math.floor(this.countNum)); }, complete: function() { $this.text(this.countNum); } }); }); a = 1; } }); </script> <div id="counter"> <div class="sqs-col sqs-col-4 counter-value" data-count="163" data-desc=" Autos Lavados">0</div> <style> .counter-value { font-size: 50px; line-height:1.4em; text-align:center; padding:18px 0; } .counter-value:after { content: attr(data-desc); display:block; text-transform:uppercase; font-size: 20px; line-height:1.3em; } <div id="counter" data-startdate="31/12/2010"> <div class="sqs-col sqs-col-4 counter-value" data-dailyincrement="2" data-count="200" data-desc=" Autos Lavados">0</div> </div> </style>
  4. Hi! So I'm designing a website for my wedding and would like to have a countdown timer replace the "September 17, 2017" at the top. I have the code/script for the timer, but the instructions want me to make a code block, which you can't do in headers. This is the page:http://www.meetusinthemountains.net/when-where/#details The CSS goes into the custom CSS editor which is fine, but it's the HTML and script that's stumping me. I tried putting both in the "Page Header Code Injection" for the index page, for the page itself, and then the script in the index and HTML in the page, but no luck. Nothing shows up. Anyone know where to go to put the code so it works?
  5. Anyone know a stylish and free countdown solution for Squarespace?
×
×
  • Create New...