Skip to content
DearFlip JS Flipbook
  • Plugins
    • WordPress Flipbook
    • Joomla Flipbook
    • Javascript Flipbook
  • Demos
    • Embedded Example
    • Popup Examples
    • Online PDF Viewer
  • Pricing
  • Docs
  • Support
  • Account
  • Blog
DearFlip JS Flipbook
  • Plugins
    • WordPress Flipbook
    • Joomla Flipbook
    • Javascript Flipbook
  • Demos
    • Embedded Example
    • Popup Examples
    • Online PDF Viewer
  • Pricing
  • Docs
  • Support
  • Account
  • Blog

Getting Started

  • Getting started
  • File Structure & Template
  • Basic Usages
  • Options List

FAQs

  • Support and FAQs
  • License Activation
  • Why are there PHP files in download zip file?

Examples

  • Examples
  • Basic – Flipbook using HTML
  • Basic – Using options
  • Adding Outline/Table of Content
  • Adding Search

Customizations

  • onPageChanged
  • Customizations
  • Open flipbook in full-screen
  • onReady Function
  • PDF links custom class and usages
  • Update URL hash on the address bar when a page flips
  • How to add custom share button?

Advanced Customizations

  • Add Close button to ToolBar
  • Advanced Customizations
  • Store last viewed flipbook page
  • Add Custom Button to Flipbook
  • Add Custom Download button to Flipbook
  • Add print button to flipbook
  • Add Custom Zoom Reset button to Flipbook
  • Thumb animation on page scroll
  • Load more button for lightboxes
  • Reset flipbook zoom on flip
View Categories
  • Home
  • Documentation
  • Customizations
  • Update URL hash on the address bar when a page flips

Update URL hash on the address bar when a page flips

When flipbook opens or the page changes, the hash URL also needs to be updated.

Note: This customization feature can be included in the core in future – if a proper solution emerges without confusing the user.

Final Result: #

Open Flipbook


What is expected: #

Changes the hash URL on Address bar when a flipbook page changes.


How to customize: #

We use the callback option onFlip() to update the URL Hash.
Add the following script to your site using the script editor plugin. This affects all flipbooks on the pages where this code is added.

<script>

jQuery(function() {

    DFLIP.defaults.onFlip = function(flipbook){
        if(flipbook.options.isLightBox == true){
            flipbook.getURLHash();
        }
    }

});

</script>

Note: Further fine-tuning and code changes might be added as per need.

Updated on February 5, 2022

More Inquiry/Info & COMMENTS:

All DearFlip comments and discussion have been moved to
https://github.com/dearhive/dearflip-js-flipbook/discussions

Table of Contents
  • Final Result:
  • What is expected:
  • How to customize:

Links

  • Terms and Conditions
  • License Terms
  • Privacy Policy

Recent Posts

  • Best Flipbook Javascript Plugins with Pros and Cons
  • PDF Partial Loading – What, How and Why?
  • PDF Hyper Links are not working? What is the issue?
  • How flipbook size works? How to make it bigger?
  • Customizing Buttons

Products

  • DearFlip WordPress Flipbook
  • DearFlip 3D Flipbook JS Plugin
  • Online PDF Viewer
  • DearFlip PDF Flipbook for Chrome
© 2025 | A product of DearHive.com