GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → tomhodgins → Dragon

tomhodgins / Dragon

Licence: mit
dragon.js is a bookmarklet that lets you drag any element on a website using a mouse or touchscreen. The goal is to speed up in-browser design critiques and brainstorming new layout ideas.

Labels

cssweb-developmentbookmarklettouchscreen

Projects that are alternatives of or similar to Dragon

Simple Keyboard
Javascript Virtual Keyboard - Customizable, responsive and lightweight
Stars: ✭ 1,275 (+873.28%)
Mutual labels:  touchscreen
Pine
Functional HTML5 and XML library for the Scala platform
Stars: ✭ 108 (-17.56%)
Mutual labels:  web-development
Web
Kottans web course 🎓
Stars: ✭ 121 (-7.63%)
Mutual labels:  web-development
Faux Pas
A script to highlight elements that are mismatched incorrectly to @​font-face blocks, which may result in shoddy faux bold or faux italic rendering.
Stars: ✭ 93 (-29.01%)
Mutual labels:  bookmarklet
Touche
The desktop application to configure Touchégg
Stars: ✭ 101 (-22.9%)
Mutual labels:  touchscreen
Bookmarks
a simple self-hosted bookmarking app that can import bookmarks from delicious and chrome
Stars: ✭ 112 (-14.5%)
Mutual labels:  bookmarklet
Urlpages
Create and view web pages stored entirely in the URL
Stars: ✭ 1,263 (+864.12%)
Mutual labels:  web-development
Touchegg
Linux multi-touch gesture recognizer
Stars: ✭ 2,241 (+1610.69%)
Mutual labels:  touchscreen
Maintenance Book
”SurviveJS — Maintenance” book
Stars: ✭ 105 (-19.85%)
Mutual labels:  web-development
Lips
Scheme based powerful lisp interpreter written in JavaScript
Stars: ✭ 120 (-8.4%)
Mutual labels:  bookmarklet
Druid On Rails
Rails learning Hub, related to Ruby, Rails and everything in between
Stars: ✭ 96 (-26.72%)
Mutual labels:  web-development
Sillynium
Automate the creation of Python Selenium Scripts by drawing coloured boxes on webpage elements
Stars: ✭ 100 (-23.66%)
Mutual labels:  bookmarklet
Pi Temp
Web server using a Raspberry Pi and DHT22 sensor to graph the humidity and temperature in my apartment over time.
Stars: ✭ 114 (-12.98%)
Mutual labels:  web-development
A11y.css
This CSS file intends to warn developers about possible risks and mistakes that exist in HTML code. It can also be used to roughly evaluate a site's quality by simply including it as an external stylesheet.
Stars: ✭ 1,277 (+874.81%)
Mutual labels:  bookmarklet
Arcgis Webpack Plugin
Webpack plugin for the ArcGIS API for JavaScript
Stars: ✭ 125 (-4.58%)
Mutual labels:  web-development
React Swipeable List
Swipeable list component for React.
Stars: ✭ 86 (-34.35%)
Mutual labels:  touchscreen
Graphav
A Graph Algorithms Visualizer built using React, Typescript and Styled Components.
Stars: ✭ 111 (-15.27%)
Mutual labels:  web-development
Open Source Handbook
⭐️ Open source projects for all skill levels
Stars: ✭ 131 (+0%)
Mutual labels:  web-development
Denovel
A Deno Framework For Web Artisan - Inspired by Laravel
Stars: ✭ 128 (-2.29%)
Mutual labels:  web-development
Colordrop
Interactive Drag & Drop Coloring with Material Design Color palette
Stars: ✭ 120 (-8.4%)
Mutual labels:  bookmarklet
View All Similar Projects ➔

Dragon.js 🐉

dragon.js is a bookmarklet that lets you drag any element on a website using a mouse or touchscreen. The goal is to speed up in-browser design critiques and brainstorming new layout ideas.

How to use

You can test the functionality with demo content on index.html, where you will also find the ‘pretty’ source code for the bookmarklet.

Demo at http://staticresource.com/dragon

To use this on other websites you have two options: run it as JavaScript on the page, or create a bookmarklet.

How to create a bookmarklet

  • Create a bookmark
  • Edit the URL
  • replace the URL with javascript: followed by the contents of dragon.js

Now you can load load any page, then tap the bookmarklet to enter 'dragon' mode

How to run as JavaScript

You have two options here as well. All browsers except mobile safari (iPad and iPhone) will allow you to simply replace the URL in the address bar of a loaded website with javascript: and then write whatever JavaScript you want. I find this easier than a bookmarklet on desktop.

The other way is by opening your Developer Tools in the browser you can paste the contents of dragon.js into the JavaScript Console and enter it and it will run on the page as well.

🐲 —happy hacking!

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].