Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Linking Directly To An Open Modal Window Through a URL?

I don't know much at all about coding so hopefully i worded the question correctly.

What I am trying to do is link a person to a specific modal window on another website. In this example, I will use the Menards weekly ad to show what I would like to do.

I would like to link somebody directly to the weekly flyer page with the modal window already open for a specific product such as the $74.99 5 Shelf Unit, which when selected opens this window (http://i.imgur.com/lntNUpK.png). This is the window that I would like to directly link to somebody.

Is there a way to modify the URL to make this possible? About all I know how to do is how to link to a specific page of the URL which would look like this /main/flyer.html?page=5

One other thing to mention is if you go to the website that provides the ads, Flipp, it does allow you to directly link to the window https://flipp.com/item/175356457-muscle-rack-5shelf-steel-unit

Thanks for any help!

like image 953
Ryan Avatar asked Feb 01 '17 02:02

Ryan


2 Answers

Yes it is possible with some javascript, it will look for #myModal on the url if it finds it, it will load the modal:

just put this at the end of your page:

$(document).ready(function() {

  if(window.location.href.indexOf('#myModal') != -1) {
    $('#myModal').modal('show');
  }

});

Now just use the following url:

http://www.mywebsite.com/page.html#myModal

*your modal must have an id:

<div class="modal" id="myModal">
like image 92
rimba Avatar answered Nov 17 '22 15:11

rimba


How about that?

function openModalOnHash() {
  if(window.location.hash) {
    var hash = window.location.hash.substring(1);
    $('#'+hash).modal('show');
  }
}

$(document).ready(function() {
  openModalOnHash()
});
like image 45
gkemperle Avatar answered Nov 17 '22 16:11

gkemperle