This article shows how to automatically link to the next in a series of publications when you have reached the last page of the current publication. (Because this renders the final page of the publication inaccessible, it is recommended to add an extra blank page to the end of any publications you intend to use with this approach.)
To use this example on your own site, start by hosting the following code on your organization's website:
<!DOCTYPE html> <html> <head> <title>Switch Publication on Last Page</title> </head> <body> <div id="myViewerContent" style="position:absolute; top:0px; left:0px; height:100%; width:100%;"></div> <script src="http://api.viewer.zmags.com/viewer/viewer.js" type="text/javascript"></script> <script> // Set up the viewer. var viewer; var pub_list = ['f009b76a','f05db378','d57acbf8']; var list_pos = 0; showPub(); // Function for displaying the next publication. function showPub(){ document.getElementById("myViewerContent").innerHTML = ""; viewer = new com.zmags.api.Viewer(); viewer.setPublicationID(pub_list[list_pos]); viewer.setParentElementID("myViewerContent"); viewer.show(); viewer.oncurrentpageschange = function(event){ checkLastPage(); }; } function checkLastPage(){ // Every time we turn a page, viewer.atLastPage(function(data){ // check whether we're on the last page. if(data.atLastPage){ // If we are... if(++list_pos == pub_list.length){ list_pos = 0; } showPub(); // ...display the next publication. } }); } </script> </body> </html>
Lastly, just swap out the three publication IDs in "pub_list" for your own publications' IDs, surrounded by quotation marks and separated by commas (as shown in the example).
Comments
0 comments
Please sign in to leave a comment.