previewer.js
Simple Jquery Module Plugin for preview link in your page. This Jquery plugin open hyperlink in your website page on pops up modal, the user can open multi hyperlinks on one modal and manage them by tabs order. Test plugin now on the DEMO page.
How to use
Add these two files in Header or Footer of your html file, Be careful before import previewer.js import JQuery or requirejs base on you need.
<link href="../css/style.css" rel=stylesheet> <script src="../js/previewer.js"></script>JQUERY
$('.contentWraper').previewer(..option..);AMD, REQUIREJS
requirejs.config({ paths: { jquery: '../node_modules/jquery/dist/jquery.min', previewer:'../js/previewer' } }); requirejs(['jquery','previewer'], function( $ ) { $('.contentWraper').previewer(..option..); });Features
$('.contentWraper').previewer({ direction:'rtl', hold_time: 2000, dragable: false, sandbox: { active: true, types: "allow-same-origin allow-scripts" } });Options
| Option | Default | Acceptable |
|---|---|---|
| hold_time | 1000 | Milliseconds |
| show_tab | true | Boolean |
| direction | ltr | LTR or RTL |
| sandbox | active: true,types: "allow-same-origin allow-scripts | active:boolean,types:Iframe Attribute |
| tab_Navigate | true | Boolean |
| style | width: "60%",height: "300px" | width: px / % / vw , height: px / % / vh |
| class | "" | CSS Class Name string |
| focus | true | Boolean |
| dragable | false | Boolean |
jquery-plugin-previewer
JQUERY Plugin - Modal Previewer - Linke Previewer
