LOADING...

Preview

Pen ID
Unlock Campus Themeforest adv

 

Code

Programming Simulator

CSS
/**
 * Switch Styles by Alexandre Joffroy
 * - https://codepen.io/alexjoffroy/pen/ORXOmR
 */
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro");
.switch {
  display: block;
  margin-top: 24px;
}
.switch .slider {
  position: relative;
  display: inline-block;
  height: 8px;
  width: 32px;
  border-radius: 8px;
  cursor: pointer;
  background: #c5c5c5;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.switch .slider:after {
  background: #eeeeee;
  position: absolute;
  left: -8px;
  top: -8px;
  display: block;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
  content: '';
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.switch label {
  margin-right: 7px;
}
.switch .input {
  display: none;
}
.switch .input ~ .label {
  margin-left: 8px;
}
.switch .input:checked ~ .slider:after {
  left: 16px;
}
.switch .input:checked ~ .slider {
  background: #fc5d9b;
}
.switch .input:checked ~ .slider:after {
  background: #ef0460;
}

.center {
  font-family: 'Source Sans Pro', sans-serif;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

h1 {
  font-weight: normal;
  margin-top: 0px;
}
JS
var checkboxes = document.querySelectorAll('input');

for( var i = 0; i < checkboxes.length; i++ ) {

  checkboxes[i].addEventListener("change", function() {
    updateBugs(this);
  });
}

function updateBugs(changedElement) {
  var checkedCount = document.querySelectorAll('input:checked').length;

  // No bugs, thats impossible!
  if( checkedCount === 0 ) {
    turnOnRandomBug(changedElement);
    if( Math.random() > 0.85 ) {
      turnOnRandomBug(changedElement);
    }
  }
}

function turnOnRandomBug(excluding) {
  turnOn = Math.floor(Math.random() * checkboxes.length);

  if( checkboxes[turnOn] === excluding) {
    turnOn = turnOn + 1;
    if( turnOn > (checkboxes.length - 1)) {
      turnOn = 0;
    }
  }

  checkboxes[turnOn].checked = true;
}

setTimeout(function() {
  turnOnRandomBug(null);
}, 400)

Description

Ever wondering what the day to day developer life is like... this basically sums it up.
Term
Mon, 11/27/2017 - 21:29

Related Codes

Pen ID
Pen ID
Pen ID
Square Adv