javascript - Changing the Hover to Click functionality using Jquery -
i'm using builtby flipbook.
html
<div id="mybook"> <div title="this page title"> <h3>yay, page 1!</h3> </div> <div> <h3>yay, page 2!</h3> </div> <div title="this title"> <h3>yay, page 3!</h3> </div> <div> <h3>yay, page 4!</h3> </div> <div title="hooray titles!"> <h3>yay, page 5!</h3> </div> <div> <h3>yay, page 6!</h3> </div> </div>
jquery
$(function() { $('#mybook').booklet({ menu: '#custom-menu', pageselector: true }); });
the demo here: http://builtbywill.com/code/booklet/demos/pageselect
now want change default behavior of page selector. getting page options on hover. want change click functionality. when click on page selector, should display menu. when click on again, should hide page selecor..thanks.
try below jquery.
$('#mybook').booklet({ menu: '#custom-menu', pageselector: true, manual: false, hovers: false, overlays: true });
in booklet.js file, change line no. 577 //add hover effects below one
// add click effects pageselector.on('click.booklet', function () { if (pageselectorlist.stop().height() == pageselectorheight) { pageselectorlist.stop().animate({height: 0, paddingbottom: 0}, 500); } else { pageselectorlist.stop().animate({height: pageselectorheight, paddingbottom: 10}, 500); } });
Comments
Post a Comment