Webflow sync, pageviews & more.
NEW

Display/Hide Items based on Count

Example

Display/Hide Items based on Count

Description

Hide/show elements on your Webflow Memberstack site based on a conditional value with this Javascript snippet. A great way to implement a credit based system or value based conditional logic for your Memberstack Webflow site.

Instructions

  1. Update the Javascript code based on your requirements
  2. Utilize Element IDs and setup Memberstack user forms and update those names

Javascript snippet

Copy

<!-- Add to closing body section -->
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script>
    function Go() {
        var credit = $("#credit").val();
        if (credit == 0) {
          $("#signUpButton").hide();
        }
        if (credit == "") {
          $("#signUpButton").show();
        }
        if (credit > 0) {
          $("#signUpButton").show();
        }
      }
      $(document).ready(function () {
        Go();
      });

      $("#credit").on("keyup keypress", function (e) {
        Go();
      });
    </script>

CSS snippet

Copy

HTML snippet

Copy

Flowradar

expert
Get it
Like
Like

Snippet tags

Validate
Count
Get
Hide/Show
Javascript
Flowradar
Code snippets
Display/Hide Items based on Count

Related code snippets

Go to snippets
Hide/show Items based on URL Parameter

Hide/show Items based on URL Parameter

Corey Moen
EXPERT
4

Show or hide divs or elements based on the parameter within a URL in Webflow. This Javascript code allows you to make your Webflow site even more dynamic by allowing you to customize elements on the page based on the URL parameter provided.

Countdown timer

Countdown timer

Nikolai Bain
EXPERT
2

Add a countdown timer to your Webflow site with this simple Javascript snippet. Want to display a countdown timer to a time of your choosing on your Webflow site? Now you can easily add one with this Javascript snippet.

Show/Hide Based on Date or Time

Show/Hide Based on Date or Time

Corey Moen
EXPERT
4

This allows you to show or hide items based on date or time in Webflow. This is great for event based information, you can display various elements based on if its prior to a time or after a specified time on your Webflow site.

Number of CMS Item Count

Number of CMS Item Count

Timothy Ricks
EXPERT
3

A simple way of displaying the number of CMS items on a page in Webflow. If you ever wanted to add a CMS item count on a page this script will allow you to easily display the total number of items shown.

Hide Element After Click w/Cookie

Hide Element After Click w/Cookie

Corey Moen
EXPERT
2

Hide an element on your Webflow site after click with a cookie via this Javascript snippet. This is perfect for welcome modals, cookie notifications, notification alerts and other items that only need to be displayed a single time.

Hide/Show Element from <select>

Hide/Show Element from <select>

Corey Moen
EXPERT
3

Dynamically hide/show elements based on the <select> option in Webflow. A great way of showing various elements based on the dropdown selection. This could be used for changes views, changing images and much more.

Count Up Numbers on Page Scroll

Count Up Numbers on Page Scroll

Corey Moen
EXPERT
4

Add count up numbers on page scroll to your Webflow site via this Javascript code. This method allows you to add a count up numbers via a page scroll to your Webflow site. As the user scrolls down numbers start to count up as they enter the viewport.

Hide/Show Elements by Breakpoint and Item Count

Hide/Show Elements by Breakpoint and Item Count

Corey Moen
EXPERT
2

This custom Javascript code allows you to show or hide items based on breakpoints and the number of items in Webflow. In this example nav buttons are hidden in a custom card slider if the number of cards is less than or equal to the number of items current and is adjusted by breakpoints of 1024, 768

DRAG
Real-time sorting by

More from author

No items found.
No items found.
DRAG
Real-time sorting by