external Image hotspot links to change pano scene

  • Hello, I have a standard vtour that was output from the droplet, I have an image also embed on the HTML page with a few hotspots, the links need to tell the tour to load the appropriate scene.

    Currently using with no luck..

    <a href="#"><img src="mypic.jpg" onclick="loadscene('scene_004');" /></a>


    Look forward to some feedback! THanks..

  • first create an connection with krpano

    in your head of the html:

    Code
    <script>
      function krpano(){  return document.getElementById('krpanoSWFObject'); }
    </script>

    then you can call the loadscene though javascript

    Code
    krpano().call('loadscene(scene_004)') ;
    Code
    <a href="#"><img src="mypic.jpg" onclick="javascript:krpano().call('loadscene(scene_004)')" /></a>

    Something like that, could have some typos though

  • Hi Zephyr, Thanks for the feedback! still seem to have some issues.. Im a beginner with KRPano finding it hard to get going but hanging in there.. Please checkout my sample code, Cant get it to work...


    <!DOCTYPE html>
    <html>
    <head>
    <title>2 Solaris</title>
    <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <style>
    @media only screen and (min-device-width: 800px) { html { overflow:hidden; } }
    html { height:100%; }
    body { height:100%; overflow: hidden; margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; background-color:#000000; }
    a{ color:#AAAAAA; text-decoration:underline; }
    a:hover{ color:#FFFFFF; text-decoration:underline; }
    </style>
    <script>
    function krpano(){ return document.getElementById('krpanoSWFObject'); }
    </script>
    </head>
    <body>
    <table width="0" border="0" align="center" cellpadding="20" cellspacing="0">
    <tr>
    <td><script src="tour.js"></script>

    <div align="center" id="pano" style="width:800px; height:500px;">
    <noscript><table style="width:800px;height:500px;"><tr style="valign:middle;"><td><div style="text-align:center;">ERROR:<br/><br/>Javascript not activated<br/><br/></div></td></tr></table></noscript>
    <script>
    embedpano({swf:"tour.swf", xml:"tour.xml", target:"pano"});

    </script>
    </div></td>
    </tr>
    </table>
    <a href="#"><img src="mypic.jpg" onclick="javascript:krpano().call('loadscene(scene_004)')" /></a>
    </body>
    </html>


    :)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!