Created
May 1, 2015 01:33
-
-
Save rev087/8b077e55e5a33dccb3e6 to your computer and use it in GitHub Desktop.
Safari extension to display viewport width as a toolbar
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?xml version="1.0" encoding="UTF-8"?> | |
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> | |
<plist version="1.0"> | |
<dict> | |
<key>Author</key> | |
<string>Bruno Daniel</string> | |
<key>Builder Version</key> | |
<string>10600.5.17</string> | |
<key>CFBundleDisplayName</key> | |
<string>Viewport Width</string> | |
<key>CFBundleIdentifier</key> | |
<string>com.yourcompany.page-data</string> | |
<key>CFBundleInfoDictionaryVersion</key> | |
<string>6.0</string> | |
<key>CFBundleShortVersionString</key> | |
<string>1.0</string> | |
<key>CFBundleVersion</key> | |
<string>1</string> | |
<key>Chrome</key> | |
<dict> | |
<key>Bars</key> | |
<array> | |
<dict> | |
<key>Filename</key> | |
<string>toolbar.html</string> | |
<key>Identifier</key> | |
<string>page-data-toolbar</string> | |
<key>Label</key> | |
<string>Viewport Width</string> | |
</dict> | |
</array> | |
</dict> | |
<key>Content</key> | |
<dict> | |
<key>Scripts</key> | |
<dict/> | |
</dict> | |
<key>DeveloperIdentifier</key> | |
<string></string> | |
<key>ExtensionInfoDictionaryVersion</key> | |
<string>1.0</string> | |
<key>Permissions</key> | |
<dict> | |
<key>Website Access</key> | |
<dict/> | |
</dict> | |
</dict> | |
</plist> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>Page data Toolbar</title> | |
<style> | |
.vpLabel { | |
text-align: center; | |
} | |
</style> | |
</head> | |
<body> | |
<div class="vpLabel"> | |
Viewport Width: | |
<span id="wLabel"></span> | |
<!-- x | |
<span id="hLabel"></span> --> | |
</div> | |
<script> | |
var wLabel = document.getElementById('wLabel'); | |
// var hLabel = document.getElementById('hLabel'); | |
function update() { | |
var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0); | |
// var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0); | |
wLabel.innerText = w; | |
// hLabel.innerText = h; | |
} | |
window.addEventListener('resize', update); | |
update(); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment