Skip to content

Instantly share code, notes, and snippets.

@slikts
Created April 13, 2011 10:45
Show Gist options
  • Save slikts/917343 to your computer and use it in GitHub Desktop.
Save slikts/917343 to your computer and use it in GitHub Desktop.
Bookmarklet to display and synchronously scroll multiple subdomains
javascript:void((function($)
{
var domain = 'example.com';
var subdomains = ['www', 'dev'];
if (!jQuery || location.hostname.indexOf(domain) < 0) {
return false;
}
var row_height = 100 / subdomains.length;
var $rows = $([]);
var label_css = {
position: 'absolute',
color: '#fff',
padding: '0 .25em',
opacity: '.1',
background: '#000',
textDecoration: 'none',
font: '10px sans-serif'
};
var iframe_css = {
width: '100%',
height: '2400px',
borderStyle: 'none',
background: '#fff'
};
$.each(subdomains, function(i, site)
{
var subdomain = subdomains[i];
var host = subdomain + '.' + domain;
if (location.port) {
host += ':' + location.port;
}
var uri = location.pathname + location.search + location.hash;
var url = location.protocol + '//' + host + uri;
var $row = $('<div>').css({
height: row_height + '%',
overflowY: 'scroll'
});
$('<a>', {
href: url
})
.text(host)
.css(label_css)
.appendTo($row);
$('<iframe>', {
src: url,
name: subdomain
})
.css(iframe_css)
.appendTo($row);
$rows = $rows.add($row);
});
$rows.each(function()
{
var $other_rows = $rows.not(this);
this.onscroll = function(e)
{
var st = this.scrollTop;
$other_rows.each(function()
{
this.scrollTop = st;
});
}
});
$('body').html('').append($rows);
$('html, body').css({
height: '100%'
});
})(jQuery));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment