{"id":13600158,"url":"https://github.com/tomhodgins/dragon","last_synced_at":"2026-01-20T19:36:19.058Z","repository":{"id":152546068,"uuid":"51386938","full_name":"tomhodgins/dragon","owner":"tomhodgins","description":"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.","archived":false,"fork":false,"pushed_at":"2016-03-09T11:44:35.000Z","size":31,"stargazers_count":145,"open_issues_count":5,"forks_count":18,"subscribers_count":8,"default_branch":"gh-pages","last_synced_at":"2024-11-07T02:36:56.789Z","etag":null,"topics":["bookmarklet","dev-tool","in-browser","touchscreen","web-design","web-development"],"latest_commit_sha":null,"homepage":"http://tomhodgins.github.io/dragon/","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tomhodgins.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":"code_of_conduct.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2016-02-09T18:03:35.000Z","updated_at":"2024-09-18T08:36:58.000Z","dependencies_parsed_at":null,"dependency_job_id":"e60bee60-ca05-478f-b8fd-4f5edacd6f69","html_url":"https://github.com/tomhodgins/dragon","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tomhodgins%2Fdragon","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tomhodgins%2Fdragon/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tomhodgins%2Fdragon/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tomhodgins%2Fdragon/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tomhodgins","download_url":"https://codeload.github.com/tomhodgins/dragon/tar.gz/refs/heads/gh-pages","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248301383,"owners_count":21080886,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["bookmarklet","dev-tool","in-browser","touchscreen","web-design","web-development"],"created_at":"2024-08-01T18:00:30.062Z","updated_at":"2026-01-20T19:36:19.009Z","avatar_url":"https://github.com/tomhodgins.png","language":"CSS","funding_links":[],"categories":["CSS"],"sub_categories":[],"readme":"# Dragon.js 🐉\n\n`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.\n\n[![](http://i.imgur.com/VubC6xd.png)](https://www.youtube.com/embed/ytIZbXnNOMM)\n\n## How to use\n\nYou can test the functionality with demo content on `index.html`, where you will also find the ‘pretty’ source code for the bookmarklet.\n\nDemo at http://staticresource.com/dragon\n\nTo use this on other websites you have two options: run it as JavaScript on the page, or create a bookmarklet.\n\n### How to create a bookmarklet\n\n- Create a bookmark\n- Edit the URL\n- replace the URL with `javascript:` followed by the contents of `dragon.js`\n\nNow you can load load any page, then tap the bookmarklet to enter 'dragon' mode \n\n### How to run as JavaScript\n\nYou 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.\n\nThe 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.\n\n# 🐲 —happy hacking!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftomhodgins%2Fdragon","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftomhodgins%2Fdragon","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftomhodgins%2Fdragon/lists"}