This is a test implementation of the JQuery PanZoom plugin. The idea is to have SVG floor plans that can be cleanly scaled and panned.
This version does not have the slider zoom-indicator.
var accelFilter = function ( x, y, z ) { | |
//ramp-speed - play with this value until satisfied (value is a float number) | |
var kFilteringFactor = 0.1, | |
//last result storage - keep definition outside of this function, eg. in wrapping object (values are floats) | |
accel[3], | |
highPassFilter = function () { | |
//acceleration.x,.y,.z is the input from the sensor |
var customButtonsCreated = false, | |
addInfoLinks = function () { | |
"use strict"; | |
}; | |
$(document).ajaxComplete(function (event, xhr, settings) { | |
"use strict"; | |
console.log("document.ajaxComplete has fired: " + event + "; " + xhr + "; " + settings.url) | |
// If the main XMLHttpRequest has completed, update the window. |
.top-bar-section .right { | |
display: none; | |
} | |
#main .live-prayer { | |
height: 0; | |
padding: 0; | |
overflow: visible; | |
border: none; | |
box-shadow: none; |
/*properties | |
addClass, after, ajaxComplete, appendTo, attr, children, css, filter, find, | |
first, prev, remove, removeAttr, removeClass, test, url | |
*/ | |
var customButtonsCreated = false, | |
// Douglas Crockford's short method for determining object types. | |
typeOf = function (value) { | |
"use strict"; | |
var s = typeof value; |
This is a test implementation of the JQuery PanZoom plugin. The idea is to have SVG floor plans that can be cleanly scaled and panned.
This version does not have the slider zoom-indicator.
This is the main home page content for the Johnson Ferry Baptist Church web site.
<div id="container"> | |
<img id="polar-bear-image" src="http://www.johnsonferry.org/portals/0/assets/newsevents/images/polarBearRunners_transpLeft_tinypng.png" alt="Polar Bear Run 2014" style="display: none;" /> | |
<h3>Header Goes Here</h3> | |
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas laoreet orci vel dui luctus accumsan. Fusce malesuada tristique orci, sit amet luctus neque placerat et. Aliquam consequat tellus auctor massa auctor, vel condimentum elit congue.</p> | |
<img id="polar-bear-image" class="sample" src="http://www.johnsonferry.org/portals/0/assets/newsevents/images/polarBearRunners_transpLeft_tinypng.png" /> | |
<p><strong>Here is the actual PNG image used in the loop. The left side provides transparency to allow the image to seamlessly overlap itself. </strong></p> | |
</div> |
<div id="msg"><span id="wheeldelta"></span><span id="panzoompan"></span></div> | |
<section id="panzoom-parent"> | |
<div class="panzoom"> | |
<img class="element" src="http://www.johnsonferry.org/portals/0/assets/common/images/JohnsonFerry_floorPlan_drawing_0.svg" /> | |
</div> | |
</section> | |
<section class="buttons"> | |
<button class="zoom-in">Zoom In</button> | |
<button class="zoom-out">Zoom Out</button> | |
<input type="range" class="zoom-range" min="1" max="5" step="0.05"/> |
body { | |
font-family: sans-serif; | |
} | |
ul { | |
list-style: none | |
} | |
li { | |
background: slategrey; |
<div itemscope itemtype="http://data-vocabulary.org/Event"> | |
<a href="http://www.example.com/events/spinaltap" itemprop="url" > | |
<span itemprop="summary">Spinal Tap</span> | |
</a> | |
<img itemprop="photo" src="spinal_tap.jpg" /> | |
<span itemprop="description">After their highly-publicized search for a new drummer, | |
Spinal Tap kicks off their latest comeback tour with a San | |
Francisco show.</span> |