Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 101 Template</title>
    <!-- Bootstrap -->
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
     <style>
    .tab{
      height: 200px;
    }
    </style>
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
     <div class='row'>
       <div class='col-xs-4'> <!-- 1/3rd size of the parent container -->
        <div class='row'>
          <!-- Image box -->
          <div class='col-xs-4'> 
            <a href="#"><img src="images/foto.png"></a> 
          </div>
          <!-- Description box -->
          <div class='col-xs-8'> <!-- 2/3rd size of parent container -->
           <div><a href="#">Název topicu nebo článku </a></div>
           <div>28.8.2014 / 19:30</div>
           <div>Lorem Ipsum</div>
         </div>
       </div>
     </div>
   <div class='col-xs-4'> <!-- 1/3rd size of the parent container -->
        <div class='row'>
          <!-- Image box -->
          <div class='col-xs-4'> 
            <a href="#"><img src="images/foto.png"></a> 
          </div>
          <!-- Description box -->
          <div class='col-xs-8'> <!-- 2/3rd size of parent container -->
           <div><a href="#">Název topicu nebo článku </a></div>
           <div>28.8.2014 / 19:30</div>
           <div>Lorem Ipsum</div>
         </div>
       </div>
     </div>
       <div class='col-xs-4'> <!-- 1/3rd size of the parent container -->
        <div class='row'>
          <!-- Image box -->
          <div class='col-xs-4'> 
            <a href="#"><img src="images/foto.png"></a> 
          </div>
          <!-- Description box -->
          <div class='col-xs-8'> <!-- 2/3rd size of parent container -->
           <div><a href="#">Název topicu nebo článku </a></div>
           <div>28.8.2014 / 19:30</div>
           <div>Lorem Ipsum</div>
         </div>
       </div>
     </div>
</div>
      
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>
 
if (location.pathname === '/welcome' || location.pathname === '/welcome/') {
  location = '/welcome/edit?html,live';
}
if (window.location.pathname.indexOf('/edit') !== -1) $('a.open').click(function (event) {
  event.preventDefault();
  window.top.$('a[href$="' + this.hash + '"]').mousedown().click();
});
var presses = 0;
var spin = [
  "Woahohaohaohaahoahaohaohaohaohaoha...",
  "Nononono...aiiiiiiiiiiiiieeeeeeee....",
  "Aaaaaaaaaghhhhh...woahwoahwoahwoahwoah...",
  "You're eeeeeeeeviiiiiiilllllllll....",
  "Eee...eee...eee...eee...eee...",
  "Woowoowoowoowoowoowoowoowoo..."
];
  
var stop = [
  "Please... never again.",
  "I'm so dizzy.",
  "That's just... cruel.",
  "Don't you have better things to do?",
  "I can't feel my toes... oh wait, I don't have any toes!",
  "This isn't fun anymore.",
  "...",
  "I'm going to be sick.",
  "Uh-oh, I think I just dropped some tables...",
  "Yep, I think I'm about to SQL-project everywhere...",
  "SELECT * FROM `stomach`...",
  "var_dump($result)...",
  "+_+"
];
$('#dave').mousedown(function () {
  
  $('#message').fadeOut(function () {
    $(this).text(spin[presses % spin.length]);
    presses = presses + 1;
  }).fadeIn();
  
}).mouseup(function () {
  
  $('#message').fadeOut(function () {
    $(this).text(stop[presses % stop.length]);
  }).fadeIn();
  
  if( presses >= stop.length - 1 ) {
    $(this).animate({left: '-999px'}, 1000 * 10, function () {
      $(this).animate({left: '0'}, 1000 * 4);
      presses = 0;
    });
  }
  
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anuragsingh722pro
0viewers