<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
<div class="chat_over">
<div id="bottom_chat" onclick="hide_chat()">Свернуть</div><div id="top_chat" onclick="show_chat()">Развернуть</div>
<div id="cht" onclick="show_chat()"><div class="ngd"><div id="wrapper" class="scroll-pane"><div id="scroller" class="comm"></div></div></div>
</div>
<script type="text/javascript">
function show_chat() {
$('.chat_over').animate({bottom:'20px'},200)
$('#top_chat').fadeOut(200,function(){$('#bottom_chat').fadeIn(200)})
}
function hide_chat() {
$('.chat_over').animate({bottom:'-212px'},200)
$('#bottom_chat').fadeOut(200,function()
{$('#top_chat').fadeIn(200)})
}
</script>
</body>
</html>
.dsnn {display:none}
#c_one_clon, #c_tell {position:absolute;top:-1500px}
.chat_over {position:fixed;padding:5px;padding-top:0;z-index:9999;bottom:-212px;right:20px;text-align:center;background:rgba(0,0,0,0.6);
border-radius:3px;
border-radius:3px;
border-radius:3px}
*:focus {outline: none}
#bottom_chat {display:none;padding:5px;color:#FFFFFF;cursor: s-resize}
#top_chat {padding:5px;color:#FFFFFF;cursor: n-resize}
.ngd {
cursor:default;
background:#FFFFFF;
padding:5px;
border-radius:3px;
border-radius:3px;
border-radius:3px;
}
.clkg {width:288px;
padding:5px;padding-bottom:6px;border:1px solid #EAEAEA;
background:#EAEAEA;
color:#000;
text-align:left;
border-radius:3px;
border-radius:3px;
border-radius:3px;}
#wrapper .comm {margin-top:0;margin-left:0px;}
.sb1, .sb2 {margin-bottom:10px}
.cs2 {margin-top:3px;color:#E32F17;font-size:10px}
.cs1 {margin-top:3px;color:#2B2B2B;font-size:10px}
.chtt iframe {display:none}
.mchat {width:250px}
.chtt {margin-top:5px}
.otbv, .otbv:hover {color:#6A6A6A}
#wrapper {
background:#FFFFFF;
width: 290px;
height: 200px;
overflow: auto;
}
Output
You can jump to the latest bin by adding /latest
to your URL
Keyboard Shortcuts
Shortcut | Action |
---|---|
ctrl + [num] | Toggle nth panel |
ctrl + 0 | Close focused panel |
ctrl + enter | Re-render output. If console visible: run JS in console |
Ctrl + l | Clear the console |
ctrl + / | Toggle comment on selected lines |
ctrl + ] | Indents selected lines |
ctrl + [ | Unindents selected lines |
tab | Code complete & Emmet expand |
ctrl + shift + L | Beautify code in active panel |
ctrl + s | Save & lock current Bin from further changes |
ctrl + shift + s | Open the share options |
ctrl + y | Archive Bin |
Complete list of JS Bin shortcuts |
JS Bin URLs
URL | Action |
---|---|
/ | Show the full rendered output. This content will update in real time as it's updated from the /edit url. |
/edit | Edit the current bin |
/watch | Follow a Code Casting session |
/embed | Create an embeddable version of the bin |
/latest | Load the very latest bin (/latest goes in place of the revision) |
/[username]/last | View the last edited bin for this user |
/[username]/last/edit | Edit the last edited bin for this user |
/[username]/last/watch | Follow the Code Casting session for the latest bin for this user |
/quiet | Remove analytics and edit button from rendered output |
.js | Load only the JavaScript for a bin |
.css | Load only the CSS for a bin |
Except for username prefixed urls, the url may start with http://jsbin.com/abc and the url fragments can be added to the url to view it differently. |