Skip to content

Instantly share code, notes, and snippets.

@lyoshenka
Created August 24, 2015 20:08
Show Gist options
  • Save lyoshenka/738d1ccc444d713aa215 to your computer and use it in GitHub Desktop.
Save lyoshenka/738d1ccc444d713aa215 to your computer and use it in GitHub Desktop.
Bookmarklet to highlight the 45-75 char range. Helps with picking a width for your content.
javascript: (function() {
function loadScript(a, b) {
var c = document.createElement('script');
c.type = 'text/javascript';
c.src = a;
var d = document.getElementsByTagName('head')[0],
done = false;
c.onload = c.onreadystatechange = function() {
if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
done = true;
b()
}
};
d.appendChild(c)
}
loadScript('//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js', function() {
var redOutline = {outline: '2px solid red'},
textyElements = 'p, li, dt, dd, h1, h2, h3, h4, h5, h6';
$(textyElements).on('mouseover.red', function() {
$(this).css(redOutline)
}).on('mouseleave.red', function() {
$(this).removeAttr('style')
}).on('click.red', function() {
var text = $(this).text(),
e = text.substring(0, 45),
t = text.substring(45, 75),
n = text.substring(75, text.length);
$(this).removeAttr('style').html(e + '<span style=\'color: red;\'>' + t + '</span>' + n);
$(textyElements).off('mouseover.red mouseleave.red click.red');
})
})
})()
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment