This job is pretty straight forward. Basically, I need each Isotope item to have its own unique address.
To start with, please have a look at the HTML attachment. As you will see, I already have several rows and columns of items that are generated by Isotope. Whenever you click on an item, it will expanding in width. It is worth noting that the HTML structure of each item is as follows:
<div class="item">
<div class="item-content">
<h2>Dolor sit amet</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam posuere pretium tellus, nec posuere nulla commodo eget. </p>
</div>
</div>
Now here's what has to be done - whenever an item is clicked, I need to execute the hashchange that will automatically change the URL according to the H2 title within that particular item, with spaces replaced by hyphens (-). So for example, if my URL is initially [login to view URL], it will change to [login to view URL] upon clicking on the item.
Most importantly, if a user opens a new browser and enters [login to view URL], the browser viewport will jump to that particular item and it must expand automatically.
As for hashchange plugins, you can use something like [login to view URL], or feel free to recommend should there be any others that are more suitable for this purpose.