Is there a compiler that opens a live preview version of my HTML and CSS in firefox? Programs like Brackets, cannot do this feature unless it is google chrome.
If you are on Mac, this is a great tool: http://incident57.com/codekit/
If not, or want something else, this works: https://prepros.io
And if you want to be really hardcore try http://livereload.com or http://www.browsersync.io with a build tool of your choice
Related
Is there any way to edit HTML code that is local on my drive in Firefox's Inspector and save the changes? Or any way to quickly edit and save HTML and view it in the browser rather than switching back and forth to a text editor?
I know you can do this in Chrome by adding the file to your workspace, but I'm wondering if Firefox has something similar.
I see that a similar question was asked about Firebug back in 2010. However, I was wondering if anything had changed since then, due to Firebug being deprecated and the functionality being available in Chrome.
There's no modern/active extension to do this as far as I know. Even with FireBug it's still not very intuitive.
Your best bet is to use an editor that has a live edit, like Brackets or PhpStorm.
Is there any way to customize Google Chrome? Which technology/language would be used? Is it possible to build a customized version with no toolbars and a webpage inside (I'm interested in something like this one, but for Chrome)?
I guess that you are talking about web apps. You can start Chrome from command line like this:
chrome --app=http://stackoverflow.com/
You can also add the --start-maximized command line switch if you want that window to be maximized.
I'd like to analyze the structure of some complex web pages that I've visited. Manually parsing out tags in the HTML source is tedious and prone to errors.
I'd like to find a utility that will accept HTML source (or a URL) as input, and show the hierarchical arrangement of the HTML elements, including source and id attributes, preferably in a treeview.
I was confident that it should be easy to find such a tool, but a few Google searches haven't turned up anything for me. I'm still confident that such a tool exists. Can the community help me find something? (I'm a Windows user and of course would prefer free if possible.)
IE8+ and Chrome both have wonderful developer tools built right in. Just visit a webpage and in IE, press F12, and in Chrome, go to wrench->tools->developer tools. They both show the tree view of the page as well as let you modify it. They're both very powerful.
Most browsers have a DOM viewer built in. Firefox has a third party extension that provides this.
These will all show the DOM after error recovery has been performed by the browser, before then you can't be sure that a valid tree could be constructed.
You can also use any good editor like Notepad++ which has highlighted syntax and node collapsing.
As other have mentioned, most modern web browsers have "developer tools" built into them which include a way to browse the HTML source in a tree-view. I've put together a quick screenshot comparison of the tools that the latest versions of the top five browsers (Internet Explorer 9, Firefox 4, Chrome 12, Opera 11 and Safari 5) offer.
Web Browser Developer Tools Screenshot Comparison
Use firebug or DOMinspector addon on firefox.
Download Firefox (http://www.mozilla.org/) and install the
Firebug addon https://addons.mozilla.org/firefox/addon/firebug/) BOTH ARE FREE
I need to build a simple presentation in HTML and JS, but it needs to run locally as a standalone and portable app in both Windows and Mac.
There are any ways to do this?
Adobe Air allows you to make native apps that run on both platforms out of HTML, CSS and JavaScript.
In addition, there are already libraries out there to help you create slideshow functionality out of HTML. Erik Meyer's S5 is a popular one: http://meyerweb.com/eric/tools/s5/
There's the MHTML format which is supported by Internet Explorer and Opera out-of-the-box and Firefox via add-on. It let's you save a whole page including images, scripts and so on in a single file.
To create one, you could just open your web page in one of those browsers and choose "save as".
Just save it as bunch of htmls, pictures and JSs and open in your favorite browser!
This is way to create a simple presentation:
http://code.google.com/p/html5slides/
Example:
http://html5slides.googlecode.com/svn/trunk/template/index.html#1
Code of example:
http://code.google.com/p/html5slides/source/browse/trunk/template/index.html
To run it standalone, you need just to save it.
Or, you can use Adobe AIR.
Bit late, but what if you take a Portable Browser? Chrome and Firefox both have a Portable App version. Another option would be to use PDF instead of HTML.
I lookong for some IE or Firefox extension, which allows to browse html source, corresponding to data, shown in browser window right now.
I have large web application with alot of code, generated by JavaScript. I need to extract real HTML code, which I see in browser window right now (View source function shows only code loaded from server, not generated by JS). Most of JavaScript debuggers can show DOM model from browser memory, but I'am need something more friendly, like printable HTML. Does anybody know tools or plugins for IE (preferred) or Firefox?
Firefox's Web Developer extension will allow you to do this. After you install it, just select View Source->View Generated Source.
FireBug for Firefox will display the HTML corresponding to what you see in the browser window right now (that is including any modifications made in JavaScript).
You can use
javascript:document.write("<xmp>"+document.documentElement.innerHTML+"</xmp>");
in IE to view the generated source.
Paste the above and execute in address bar of IE.