I come back today to share a new pen I made. Again I used jade for the HTML and SCSS for the CSS. (still learning…)
This is an html-css-js tool I made to emulate a browser inside your browser. It can be used for website demonstration or to give a stylish way to show a website on yours… Do you still follow me ? no ? OK, I’ll show you:
See the Pen browser inception by Benjamin CARADEUC (@benavern) on CodePen.
To add browsers on your webpage, you just have to add divs with the
z-browser class and that’s all. If you put something inside, it will be overwritten.
You can specify the starting website url by adding it the attribute
data-url setted to the url you want (don’t forget the
http:// or it won’t work.)
<div class="z-browser" data-url="http://example.com/"></div>
Isn’t it awesome ??? Let me know what you think in the comments bellow!