JavaScript

$(function(){
  var defTime = 150
  var timesTime = 17.5 //自動湧きの間隔秒
  if(location.search.match(/\d+x?/)){
    defTime = Number(location.search.substring(1).split('x')[0]);
  }
  if(location.search.match(/x\d+/)){
    timesTime = Number(location.search.substring(1).split('x')[1]);
  }
  //https://hi0a.com/demo/-js/js-timer-150-multi-auto/?30x3

  var iDivs = $('<div>').addClass('iDivs');
  $('#demo').append(iDivs);

  var iDiv = $('<div>').addClass('iDiv');
  var iframe = $('<iframe>', {src : '../js-timer-120/?' + defTime});
  var minusButton = $('<div>').addClass('btn').addClass('minus').text('-');
  iDiv.append(minusButton);
  iDiv.append(iframe);
  iDiv.on('click', function(){
    $(this).remove();
  });

  var minusButtonAll = minusButton.clone().addClass('all');
  minusButtonAll.on('click', function(){
    $('.iDiv').remove();
  });

  var plusButton = $('<div>').addClass('btn').addClass('plus').text('+');
  plusButton.on('click', function(){
    if($('.iDiv').length > 99){return;}
    var clone = iDiv.clone(true);
    if($('.iDiv').length > 9){
      clone.addClass('over9');
    }
    iDivs.append(clone);
    console.log(defTime);
    setTimeout(function(){
      clone.remove()
    }, (defTime + 1.6)*1000 );
  });

  var intervalID;
  var timesButton = $('<div>').addClass('btn').addClass('times').text('x');
  timesButton.on('click', function(){
    $(this).toggleClass('on');
    if($(this).hasClass('on')){
      intervalID = setInterval(function(){
        plusButton.trigger('click');
      }, timesTime * 1000);
    } else {
      clearInterval(intervalID);
    }
    plusButton.trigger('click');
  });

  $('#demo')
    .append(timesButton)
    .append(plusButton)
    .append(minusButtonAll);
  //plusButton.trigger('click');
});

CSS

html,body{
  min-height:100%;
  overflow:hidden;
  background-color:#000;
}
iframe{
  height:100%;
  width:100%;
}
.iDiv{
  display:flex;
  width:90%;
  height:80px;
  padding-right:80px;
}
.btn{
  display:block;
  width:80px;
  height:80px;
  line-height:80px;
  text-align:center;
  background-color:#fff;
  color:#000;
  font-weight:bold;
  font-size:64px;
  opacity:0.5;
  cursor:pointer;
  user-select:none;
  border:4px solid #777;
  box-sizing: border-box;
}

.btn:hover{
  background-color:#acf;
}
.btn.on{
  background-color:#c00;
}

.plus{
  display:block;
  position:fixed;
  bottom:0;
  right:80px;
  width:calc(100% - 80px - 80px);
  z-index:9;
}
.minus.all{
  display:block;
  position:fixed;
  bottom:0;
  left:0;
  z-index:9;
}

.times{
  display:block;
  position:fixed;
  bottom:0;
  right:0;
  z-index:9;
}


.iDivs{
  width:100%;
  height:calc(100% - 80px);
  min-height:360px;
  overflow-y:auto;
}


.iDiv.over9{
  height:40px;
}
.iDiv.over9 .btn{
  width:40px;
  height:40px;
  line-height:40px;
  font-size:32px;
}