A Pen by Joe Watkins.

index.html

<section>
  <h1>User-Affected Layouts</h1>
  <p>Give the user some power over the layout and let them<br><span>kill the hero slider</span><br>hover over slider &raquo; kill it &raquo; refresh</p>
</section>

<section class="slider-wrapper">
  <div class="flexslider">
    <ul class="slides">
      <li><img src="http://flickholdr.com/1200/400" />
      </li>
      <li><img src="http://flickholdr.com/1200/400" />
      </li>
      <li><img src="http://flickholdr.com/1200/400" />
      </li>
      <li><img src="http://flickholdr.com/1200/400" />
      </li>
    </ul>
  </div>
</section>

<section>
  <h2>Lorem ipsum dolor</h2>
  <p>Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail.</p>
  
  <p>Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail.</p>
  
  <p>Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail.</p>
  
  <p>Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail.</p>
  
  <p>Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail. Bacon ipsum dolor sit amet salami short ribs shank, ribeye tri-tip pig boudin hamburger shankle meatloaf filet mignon. Boudin pork rump capicola ham hamburger. Landjaeger pork belly boudin kielbasa tail sausage. Bacon pork pancetta strip steak beef tongue drumstick ham cow rump tri-tip salami flank jerky. Prosciutto pork chuck tail. Chicken turkey swine frankfurter pork chop. Capicola frankfurter sausage swine, shankle chuck sirloin tail.</p>
  
</section>

script.js

/* 
In this demo we are:
- adding a close button to the slider
- using localStorage to retain user's decision
- conditionally run the slider
*/
var $targetSliderParent = $('.slider-wrapper'),
    $targetSlider = $targetSliderParent.find('.flexslider'),
    killSliderClass = "kill-slider",
    $closeButton = "<a class='" + killSliderClass + "' href='#' />",
    killSliderState = localStorage.killSlider;
// if we haven't killed the hero yet
if (!killSliderState) {
    $targetSlider.prepend($closeButton).each(function() {
        var closeButton = $(this).find('.' + killSliderClass);
        closeButton.click(function(e) {
            e.preventDefault();
            localStorage.killSlider = true;
            $(this).closest($targetSliderParent).slideUp(500);
        });
    });
    // run slider
    _slider($targetSlider);
    // show slider area
    $targetSliderParent.show();
}

function _slider($targetSlider) {
    $($targetSlider).flexslider({
        animation: "slide"
    });
}

style.scss

@import "compass";
@import url('//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css');

.slider-wrapper {
  display:none;
}

.kill-slider:before {
  position:absolute;
  top:-1.25em;
  right:-1em;
  font-family:Fontawesome;
  font-size:1.9em;
  content: '\f057';
  color:#000;
  z-index:9999;
  opacity:0;
  transition:all .3s ease-in-out;

}

.flexslider:hover .kill-slider:before {
  right:10px;
  top:0px;
  opacity:1;
}











/* demo styles */
$brandColor: #E84E8A;

body {
  text-align:center;
  color:#fff;
  margin:0px;
}

section {
  padding:1.3em;
  p {
    font-size:1.3em;
  }
  h1, h2 {
    margin-top:0px;
  }
  p {
    span {
      background:#fff;
      color:darken($brandColor,20%);
      padding:0 .3em;
      border-radius:.3em;
    }
  }
  background:darken($brandColor,30%);
  &.slider-wrapper {
    background:darken($brandColor,20%);
  }
  &:last-of-type {
    background:darken($brandColor,40%);
  }
}

.kill-slider {
  text-decoration:none;
}

.slider-wrapper {
  padding-bottom:3.125em;
}

.flexslider {
  max-width:75em;
  margin:0px auto;
  position:relative;
  padding-top:1em;
}

.flexslider:hover .flex-prev {
  left:-1.8em;
}
.flexslider:hover .flex-next {
  right:-1.8em;
}

@import url('//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css');

User-Affected-Layouts---Kill-Slider.markdown

User-Affected Layouts - Kill Slider

User-Affected Layouts is a concept of empowering the user, when appropriate, letting them have some control over their experience. View in full page.

A Pen by Joe Watkins on CodePen.

License.