How can I email links to a modal on my webpage? - modal-dialog

Question

Basically, I want to be able to send a link in email that links to my website that when clicked, it opens the site and the modal I added to the link. In other words, how can I send a link that will open the modal automatically?
here is my modal I want to open:
<div id="modal-video11" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title" align="center">State of the Table Grape Industry with Barry Bedwell</h4>
</div>
<div class="modal-body">
<div class="videoWrapper">
<p align="center"><iframe width="420" height="315" src="https://www.youtube.com/embed/PYq5hi5Y9rI" frameborder="0" allowfullscreen></iframe></p>
</div>
</div>
<div class="modal-footer">
<a class="btn btn-pnp center-block" href="https://www.youtube.com/user/CaliforniaAgNet">View MORE Videos On Our Youtube Channel!</a>
</div>
</div>
</div>
</div>
why can't I link it like this? : http://www.americanvineyardmagazine.com/index.html#modal-video11
I also tried using this javascript at the end of my page but it made no difference. The modal doesn't open:
<script type="text/javascript">
$(document).ready(function() {
if(window.location.href.indexOf('#modal-video11') != -1) {
$('#modal-video11').modal('show');
}
});</script>

Answer 1

Try this out:
jQuery(function($){
$(document).ready(function() {
if(window.location.href.indexOf('#modal-video11') != -1) {
$('#modal-video11').modal('show');
}
});
});

Answer 2

The code you are posting is correct, but there is a javascript error in that page. You are trying to use jquery ($) in line 143 before loading jquery (line 2001).
If you put that code after loading jquery (at the end), it should work.
<script type="text/javascript">
$(document).ready(function() {
if(window.location.href.indexOf('#modal-video11') != -1) {
$('#modal-video11').modal('show');
}
});
</script>