News Examples Documentation Download Buy Forum Contact

Documentation

Plugins

XML Extensions

Tools


Third Party Software
for krpano

HTML Page Plus for HTML5 only
by Daitaoli - 358565440@qq.com

Description

We are pleased to present a simple to install and extremely intuitive to use brand new html pop-up plugin for krpano/panotour. It has responsive layout and works well under fullscreen mode. This plugin support insert inline html,iframe page,image galleries,ajax content,etc. Easy to use, just copy files into folder and add simple line of code,done.

  • The HTML Page Plus adds an interactive html page to the viewer.
  • The plugin works well/perfect under fullscreen mode.
  • The plugin has responsive layout.
  • The plugin optimized for mobile devices.
  • The plugin allow many different kinds of content to be added: inline html, image galleries, slide-shows, iframe pages, etc...
  • The plugin support pan & zoom under image galleries mode.
  • The plugin can display contents from any sever.
  • The plugin use js function to pop-up html window,qrcode img in this plugin can recognized by long press(based on html5 api,you can test it in wechat app).
  • Allow to use JavaScript, jQuery libraries, PHP, ASP, JSP etc...
  • The plugin is easy to use,just need basic html knowledge.
  • One codebase works the same on desktops and devices.
  • The simple js interface.
  • The plugin support pdf file now.
  • The plugin support team intro.

Buy/Download

  • The plugin price is €49.
  • The archive includes the ready-to-use examples:
    • the inline html(with/without data-caption edition),
    • the image galleries with slide-show,autoplay and thumbs,
    • the mixed content with html page and photos,
    • the iframe page with responsive layout.(with/without data-caption edition)
  • China buyer can use wechat pay for it.国内用户可通过添加185 0905 1273微信转账.
  • After purchase,I'll send plugin to you.

two ways to purchase : install Wechat app on your mobile,bind your bank card in app, then use wechat app scan this qrcode to pay this plugin.

or you can install Alipay app,then use Alipay app scan qrcode below this line

Usage

1. The plugin use js scripts. You must place the folder with the name js in the same directory as your main html file, which start the pano/tour. files path

2. You must include in the head of your html file the js scripts and the style sheet before the close tag </head>

<link rel="stylesheet" href="js/popup.css" />
<script src="js/jquery.js"></script>
<script src="js/popup.js"></script>							

3. go on,embed some js functions in html file before the close tag </head>.

<script type="text/javascript"> 
<!-- pop-up inline html content directly --> 
function a1(){
$.ddttll.open('<div class="message"><h2>Hello!</h2><p>You are awesome!</p></div>');
}



<!-- pop-up image galleries --> 
function a2(){
	$.ddttll.open([
		{
			src  : 'photo/1.jpg',
			opts : { caption : 'First caption'}
		},
		{
			src  : 'photo/2.png',
			opts : { caption : 'Second caption'}
		}
		], {
		loop : false
	});
}



<!-- another way to open complex inline html content -->
function a3(){
   $.ddttll.open({
      src  : '#hidden-content',
      type : 'inline' });
}



<!-- powerful! you can open iframe page! so any content you can use by this way -->
function a4(){
$.ddttll.open({
src  : 'https://krpano.com/plugins',
type : 'iframe',
opts : {
caption : 'heres the caption text'
}

});
}






</script> 

4. Last one step! you just need call these js functions in your xml file.

<hotspot ... onclick="js(a1();)" />					

Settings

<script type="text/javascript">
function aaa(){
     $.ddttll.open({
          src  : '' // Source of the content
          type : '' // Content type: image|inline|ajax|iframe|html (optional)
          opts : {} // Object containing item options (optional)
        });
 }
</script> 					

ScreenShot

inline html

inline html

object vr1

object vr demo1

object vr2

object vr demo2

parallax&magnify

parallax&magnify

photo_pan_zoom

photo_pan&zoom

3d chart

3d chart

pdf_support

pdf_support

team_intro

team_intro

iframe page

iframe page

inline html with caption

inline html with caption

inline html without caption

inline html without caption

responsive image galleries(with caption) responsive image galleries(with caption)

responsive image galleries(with caption)

image pan&zoom(with caption)

image pan&zoom(with caption)

image galleries without caption

image galleries without caption

inline html pop-ups under krpano fullscreen mode

inline html pop-ups under krpano fullscreen mode

image galleries pop-ups under krpano fullscreen mode

image galleries pop-ups under krpano fullscreen mode

image galleries pop-ups under krpano fullscreen mode with thumbs

image galleries pop-ups under krpano fullscreen mode with thumbs

image galleries pop-ups under krpano fullscreen mode with autoplay

image galleries pop-ups under krpano fullscreen mode with autoplay