Answers.Body: <p>Maybe use a smarter slider? I frequently use <a href="http://kenwheeler.github.io/slick/" rel="nofollow noreferrer">Slick</a>, which will only initialise when the number of items is > 1.</p>
  
  <p>In addition, within my template code I would only include the markup required only for the slider if the number of slides is > 1, as I like to keep my markup clean. Something like:</p>
  
  <pre><code>  {% if entry.hero|length &gt; 1 %}&lt;div class="hero-slider"&gt;{% endif %}
      // Hero / Slider markup goes here…
    {% if entry.hero|length &gt; 1 %}&lt;/div&gt;{% endif %}
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-01-12T12:47:00.547Z
Answers.Text: Hi. Thanks for this but I don't know exactly which template i'd put that into to make that potentially work!
Answers.UserDisplayName: Jacqui
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-01-12T15:18:13.647Z
Answers.Text: I would guess it's in a partial, though it could also be directly in the default (homepage) template; index.html or index.twig. It's impossible to say, as like all Craft sites the template is custom built for your site.
Answers.UserDisplayName: Seth Warburton
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-01-12T11:54:56.517Z
Answers.LastActivityDate: 2017-01-12T11:54:56.517Z
Answers.UserDisplayName: Seth Warburton
Answers.Body: <p>If you no longer want the slider to be a slider, you can remove the relevant javascript and then it should just do nothing.
  It's hard to say exactly what javascript to remove as you haven't provided all of it.</p>
  
  <p>Additionally, you may want to alter the asset field settings to only allow 1 image in this field otherwise multiple could be output.</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-01-12T12:13:32.000Z
Answers.Text: I'm struggling to see which java is relevant to the slider. I'm coming across it everywhere!! 
  
  The asset image field is limited to 1 image.
Answers.UserDisplayName: Jacqui
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-01-12T17:17:49.930Z
Answers.Text: Hard to help when you can't see any JS! I would search the project with a "find in files" method to look for "heroslider" and see what comes up.
Answers.UserDisplayName: joep
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-01-12T11:59:01.663Z
Answers.LastActivityDate: 2017-01-12T11:59:01.663Z
Answers.UserDisplayName: joep
Body: <p>We've got a HeroSlider on our website, and I no longer wish for the slider to slide (if that makes sense?). </p>
  
  <p>Currently the homepage is 3 slides, however when I remove the 2 slides I don't want, the 1st slide still tries to slide, and in doing so disappears.</p>
  
  <p>I need it to be static.</p>
  
  <p>As far as I can see the code for the slider is:</p>
  
  <pre><code>        var $heading    = $('.heroslider-text h2');
          var $para       = $('.heroslider-text p');
          var $btn        = $('.heroslider-text .btn');
  
          // Define animation sequence for hero elements.
          if($para.length){
              this.seq = [
                  { elements: $heading, properties: { opacity: [1, 0], translateY:[0, 50] }, options: { duration: 250 } },
                  { elements: $para, properties: { opacity: [1, 0], translateY:[0, 50] }, options: { delay:60, duration: 250, sequenceQueue: false } },
                  { elements: $btn, properties: { opacity: [1, 0], translateY:[0, 50] }, options: { delay:60,  duration: 250, sequenceQueue: false } }
              ];
          } else {
              this.seq = [
                  { elements: $heading, properties: { opacity: [1, 0], translateY:[0, 50] }, options: { duration: 250 } },
                  { elements: $btn, properties: { opacity: [1, 0], translateY:[0, 50] }, options: { delay:60,  duration: 250, sequenceQueue: false } }
              ];
          }
  
      };
  
      this.runSequence = function(){
          if($('.heroslider-text').hasClass('animated')){
              $.Velocity.RunSequence(this.seq);
          }
      };
  };
  </code></pre>
  
  <p>Thank you very much.</p>
  
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2017-01-12T15:38:03.107Z
Comments.Text: I am voting to close because this question is not Craft CMS specific.
Comments.UserDisplayName: Aaron Berkowitz
Tags: <templating><frontend>
Title: How to stop a Slider
ThreadText: # How to stop a Slider
  
  (Asked by: username_0 on 2017-01-12)
  
  We've got a HeroSlider on our website, and I no longer wish for the slider to slide (if that makes sense?).
  
  Currently the homepage is 3 slides, however when I remove the 2 slides I don't want, the 1st slide still tries to slide, and in doing so disappears.
  
  I need it to be static.
  
  As far as I can see the code for the slider is:
  
  ```
          var $heading    = $('.heroslider-text h2');
          var $para       = $('.heroslider-text p');
          var $btn        = $('.heroslider-text .btn');
  
          // Define animation sequence for hero elements.
          if($para.length){
              this.seq = [
                  { elements: $heading, properties: { opacity: [1, 0], translateY:[0, 50] }, options: { duration: 250 } },
                  { elements: $para, properties: { opacity: [1, 0], translateY:[0, 50] }, options: { delay:60, duration: 250, sequenceQueue: false } },
                  { elements: $btn, properties: { opacity: [1, 0], translateY:[0, 50] }, options: { delay:60,  duration: 250, sequenceQueue: false } }
              ];
          } else {
              this.seq = [
                  { elements: $heading, properties: { opacity: [1, 0], translateY:[0, 50] }, options: { duration: 250 } },
                  { elements: $btn, properties: { opacity: [1, 0], translateY:[0, 50] }, options: { delay:60,  duration: 250, sequenceQueue: false } }
              ];
          }
  
      };
  
      this.runSequence = function(){
          if($('.heroslider-text').hasClass('animated')){
              $.Velocity.RunSequence(this.seq);
          }
      };
  };
  
  ```
  
  Thank you very much.
  
  **Tags:** templating, frontend
  
  > **Comments:**
  > **username_1**: I am voting to close because this question is not Craft CMS specific.  
  
  ---
  
  ## 2 answers
  
  ### Answer by username_2 on 2017-01-12. Score: 1
  
  Maybe use a smarter slider? I frequently use [Slick](http://kenwheeler.github.io/slick/), which will only initialise when the number of items is > 1.
  
  In addition, within my template code I would only include the markup required only for the slider if the number of slides is > 1, as I like to keep my markup clean. Something like:
  
  ```
    {% if entry.hero|length > 1 %}<div class="hero-slider">{% endif %}
      // Hero / Slider markup goes here…
    {% if entry.hero|length > 1 %}</div>{% endif %}
  
  ```
  
  > **Comments:**
  > **username_0**: Hi. Thanks for this but I don't know exactly which template i'd put that into to make that potentially work!  
  > **username_2**: I would guess it's in a partial, though it could also be directly in the default (homepage) template; index.html or index.twig. It's impossible to say, as like all Craft sites the template is custom built for your site.  
  
  ---
  
  ### Answer by username_3 on 2017-01-12. Score: 0
  
  If you no longer want the slider to be a slider, you can remove the relevant javascript and then it should just do nothing.
  It's hard to say exactly what javascript to remove as you haven't provided all of it.
  
  Additionally, you may want to alter the asset field settings to only allow 1 image in this field otherwise multiple could be output.
  
  > **Comments:**
  > **username_0**: I'm struggling to see which java is relevant to the slider. I'm coming across it everywhere!!   The asset image field is limited to 1 image.  
  > **username_3**: Hard to help when you can't see any JS! I would search the project with a "find in files" method to look for "heroslider" and see what comes up.  
  
  ---
  
  