{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 Lonely孤独者° 的问题《Is there an HTML/CSS/JS editor that immediately sh》','https://www.manongdao.com/q-145644.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
I just saw Bret Victors Keynote called "Inventing on Principle". At around 3:34 Minutes he uses a code editor that - after a change he makes - immediately shows consequences of it. As he types there are instant results.
This is the video I am talking about: http://vimeo.com/36579366
Another example is this real-time online html editor.
Can you tell me which offline editor I could use to work on my web projects (HTML/CSS/JS) this way? Preferably it can be used on OS X. Thanks!
Brackets looks nice, but still on development.
I don't know if there are any free ones, but TextMate has a live preview window. Just don't download the version 2 beta — I don't think it's been implemented there yet. You can also check out Coda and BBEdit.
CoffeeCup has a Web Editor in beta that uses live preview and includes the code-preview connection you see in the video. Select an element in the preview and the corresponding HTML/CSS is selected, or select HTML code and see which element it applies to in the preview.
Espresso updates the preview window as you type in the editor but it's for mac only
http://www.youtube.com/watch?v=TBUC-7D1LIc
this guy already came up with a similar open source program like the one in the video. He also is going to be putting up the source on Github soon.
If you're still looking for an offline editor, you could always check out Notepad++. It has a live html preview, but doesn't show most of the newer stuff; just basic layouts as well as basic CSS.
Notepad++ Website