Question

I have a read more/less jquery plugin that I'm using. One of the settings (startOpen:true) allows the content to be expanded by default when you open the page:

<script>
    $('#blog-post-2').readmore({
      maxHeight: 212,
      startOpen: true
    });
    $('#blog-post-1').readmore({
      maxHeight: 212
    });
</script>

What I would like to do is put the startOpen:true function into the URL of this page, like so: mywebsite.com/mypage.html&startOpen:true

The reasons for this is that I want to control which users see it expanded or not.

I'm not entirely sure how I would go about achieving this.

Does anyone have the answer to this?

Was it helpful?

Solution

If you call mypage.html#blog-post-1, you can try something like:

// Your settings here
$( '#blog-post-1, #blog-post-2' ).readmore({
    maxHeight: 212
});

// Get the active hash
var hash = window.location.hash;

// Set the active element depending on the hash call
$( hash ).readmore({
    startOpen:true
});

OTHER TIPS

Get this jquery url parsing plugin: https://github.com/allmarkedup/purl

Then if your url is mywebsite.com/mypage.html&startOpen:true

you add this to your code

var startOpenSetting = $.url().param('startOpen');

$(document).ready(function(){

startOpen: startOpenSetting;

)};
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top