How can i trigger a bootstrap modal at a specific height of the window scroll , for just Once?

Question

I want to show user a modal window when vertical scrollbar position is beyond a specified limit.

Here is my HTML code

      <div class="container">
          <h2>Modal Example</h2>
          <!-- Trigger the
      modal with a button -->
          <!-- Modal -->
          <div class="modal fade" id="myModal" role="dialog">
              <div class="modal-dialog">
                  <!-- Modal content-->
                  <div class="modal-content">
                      <div class="modal-header">
                          <button type="button" class="close" data-dismiss="modal">&times;</button>
                          <h4 class="modal-title">Modal Header</h4>
                      </div>
                      <div class="modal-body">
                          <p>Some text in the modal.</p>
                      </div>
                      <div class="modal-footer">
                          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                      </div>
                  </div>
              </div>
          </div>
      </div>
      <script>
      $(window).scroll(function() {
          if ($(document).scrollTop() > 1000) {
              $('#myModal').modal('show');
          }
      });
      </script>
      <p>
          Cupidatat master cleanse carles small batch VHS. Brooklyn umami odio, post-ironic selvage hella farm-to-table. Brooklyn DIY cardigan cosby sweater marfa. 
          Gastropub bicycle rights in seitan non small batch. Placeat non street art umami, yr wolf sed skateboard cupidatat direct trade seitan put a bird on it occaecat 
          small batch. Hoodie marfa umami, enim scenester cred synth vero gastropub aliqua brunch mlkshk ut. Sed brunch pop-up irony quis. Etsy stumptown 3 wolf moon in 
          carles, vinyl chillwave. Beard sapiente nulla banh mi cosby sweater 8-bit craft beer, ethical art party portland tumblr godard quinoa occaecat et. Stumptown art 
          party ea bushwick. Cardigan DIY non cred ullamco duis. Id gastropub pop-up narwhal culpa fanny pack voluptate, street art gluten-free eiusmod quis aute lo-fi. 
          Nostrud ethical irure keffiyeh umami lomo. Twee swag nihil culpa odd future. > </p>

Answer 1

Add an attribute to your modal, for example displayed and set a value which you can use as a flag for displayed once or not. And on scroll do check for attribute value. and change it after being displayed once.

So your html should be something like,

<div class="modal fade" id="myModal" role="dialog" displayed="false">

and your script tag invoking modal should be something like,

    $(window).scroll(function() {
       if ($(document).scrollTop() > 3000 && $("#myModal").attr("displayed") === "false") {
         $('#myModal').modal('show');
         $("#myModal").attr("displayed", "true");
       }
     });

Here is jsFiddle demonstrating same.