|
|
| (46 intermediate revisions not shown) |
| Line 4: |
Line 4: |
| | <html> | | <html> |
| | | | |
| - | <img src="https://lh5.googleusercontent.com/-CIHTtaRbdgM/TiAa0Y3zubI/AAAAAAAAAO4/1dhIyuanIzc/s640/IMG_4497.JPG" height="192" width="288" /> <img src="https://lh5.googleusercontent.com/-XwFZY6HcLGw/ThdO1E3FgTI/AAAAAAAAANE/Swz7_vKNSnE/s288/IMG_4496.JPG" height="192" width="288" />
| |
| | | | |
| | + | <!-- Lab 360 http://www.rockechris.com/jquery/jquery.panorer.js.html --> |
| | + | <!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> --> |
| | | | |
| - | <!-- Lab 360 -->
| + | <script src="http://www.rockechris.com/jquery/jquery.panorer.js"></script> |
| - | | + | |
| - | <script src="https://sites.google.com/site/bobstringfiles/arcanum/jquery.mousewheel.min.js"></script> | + | |
| - | <script src="https://sites.google.com/site/bobstringfiles/arcanum/jquery.panorama360.js"></script>
| + | |
| | <script> | | <script> |
| - | <!--
| |
| - | $(function(){
| |
| - | $('.panorama-view').panorama360({
| |
| - | bind_resize: false // no need to subscribe to window resize event
| |
| - | });
| |
| - | });
| |
| - | -->
| |
| - | </script>
| |
| | | | |
| - | <div class="panorama round" style="width:700px;height:500px;padding:10px;top:50%;left:50%;margin-top:-260px;margin-left:-360px;background-color:#444;">
| + | $(document).ready(function() { |
| - | <div class="panorama-view">
| + | //use panorer plugin. |
| - | <div class="panorama-container">
| + | $('#pano').panorer({ 'easing': 'linear', 'direction': "EW" }); |
| - | <img src="https://sites.google.com/site/bobstringfiles/arcanum/arcanumlab.jpg" data-width="7476" data-height="501" alt="Panorama" />
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | <a class="info round" href="http://www.arcanumproject.com">Arcanum Lab</a>
| + | |
| - | </div>
| + | |
| | | | |
| | + | }); |
| | | | |
| | + | </script> |
| | | | |
| | | | |
| - | <style> | + | <div style="color:#1F7C83; font-weight:bold;text-transform:uppercase; font-size: 120%;margin-left:170px;"> Our lab! </div> |
| - | /* layout */
| + | </html>{{:Team:Sevilla/Templates/hr|colour=#FFB880|class=lab}}<html> |
| - | .panorama,.panorama-view{width:100%;height:100%;overflow:hidden}
| + | </br> |
| - | .panorama,.panorama-container{position:relative}
| + | |
| - | .panorama-container img{height:100%;position:absolute;top:0}
| + | <div id="pano" style= "width: 700px; height: 501px;border: medium solid black; position: relative; overflow: hidden;margin-left:170px;"> |
| - | .panorama .info,.panorama-view .area{position:absolute;display:block} | + | |
| - | .panorama .info{right:10px;bottom:10px} | + | <img alt="Example" src="http://institucional.us.es/igembiouse/360/View_from_Sky_Tower_Akl_small.jpg" style="position: absolute; left: -100.3px;"> |
| | + | |
| | + | </div> |
| | | | |
| - | /* style */
| |
| - | .panorama-view{cursor:url(../images/openhand.cur),default}
| |
| - | .panorama-view.grab{cursor:url(../images/closedhand.cur),default}
| |
| - | .panorama .info{padding:6px;opacity:0.4;background-color:#000;color:#fff;font:11px bold Arial,sans-serif;text-decoration:none}
| |
| - | .panorama .info:hover{opacity:0.6}
| |
| - | .panorama-view .area{opacity:0.2;background-color:#000;cursor:pointer}
| |
| - | .panorama-view .area:hover{opacity:0.4}
| |
| - | .panorama-view img{user-select:none;-o-user-select:none;-moz-user-select:none;-webkit-user-select:none)}
| |
| - | </style>
| |
| | </html> | | </html> |
"
