Simple jQuery Viewport Plugin For Web - Porthole

File Size: 4.55 KB
Views Total: 1974
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Simple jQuery Viewport Plugin For Web - Porthole

Porthole is a lightweight and easy-to-use jQuery plugin that adds a simple viewport which can be dragged to move by your mouse on your web site.

Basic Usage:

1. Include jQuery library and Porthole.js on your html page

<script src=""></script>
<script src="jquery.porthole.min.js"></script>

2. Markup Html structure

<div id="viewport" style="width: 500px; height: 400px;">
<div style="background: url(js_wiki.png); width: 600px; height: 600px;"> </div>

3. Call the plugin


4. Options


  // Show viewport with start position 20px from left and 50px from top
  start : [20, 50], 

  // callback function
  callback: function() { alert('loaded'); } 

Change log:


  • v2.0.0

This awesome jQuery plugin is developed by DmitryPhilimonov. For more Advanced Usages, please check the demo page or visit the official website.