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.

demo here

$('#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

Popular posts from this blog

java.util.scanner - How to read and add only numbers to array from a text file -

rewrite - Trouble with Wordpress multiple custom querystrings -