A nice alternative to using the ol’ and ugly default Javascript alert box. Allows multiple options and callbacks while staying small and simple.
Tag: javascript
Resource – Intro to Grunt by Chris Coyier on 24 Ways
Link:
http://24ways.org/2013/grunt-is-not-weird-and-hard/
Description:
Fantastic resource on getting started with Grunt.js. Practical implementations of script concats, minimizing, and automation. Recommend as a simple resource and starting template for many common web site tasks.
Notes:
- The concat plugin will combine files in the order given, or in the order the search parameters reveal. Make sure you’re loading scripts dependencies first.
- http://gruntjs.com/
- https://github.com/gruntjs/grunt-contrib-concat
- https://github.com/gruntjs/grunt-contrib-uglify
JavaScript Bookmarklet: Outline/Border all Elements of Site for Quick Development & Debugging
Need to outline all HTML elements on an open web page? I’m sure there has been a time when you’ve used something like this to do so:
* { border:1px solid red; } Which gives you a quick visual look at all elements on the page and how they align. It’s simple and by all means works just fine.
To make things even more convenient, here’s a quick and handy little JavaScript bookmarklet for you web developers to save. Full credit and thanks go to “beaver82” in the following /r/webdev/ thread. I’ve edited one of his/her original scripts to include a border instead of outline, in case you do want to affect the box size.
Snippets:
The border/outline scripts are distinguished by the file names listed above.
Usage
- Drag or save the JavaScript snippet desired (either js_border_elems.js, js_outline_elems.js, or both) to your browsers bookmarks bar.
- Name it something useful, such as “Outline * Elements“
- Click on the snippet to outline/border elements on the current page. Click again to remove the outlines/borders.
Enjoy! If you have any similar useful snippets, please do share them in the comments section.