Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
​
​
<div id="line1">
​
  </div>
  
  <div id="line2">
    
</div>
  
  <div id="line3">
    
</div>
  
  <div id="line4">
    
</div>
  
  <div id="line5">
​
  </div>
  
  <div id="line6">
    
</div>
  
  <div id="line7">
    
</div>
  
  <div id="line8">
    
</div>
  
​
  
  
  
​
<div id="line9">
​
  </div>
  
  <div id="line10">
    
</div>
  
  <div id="line11">
    
</div>
  
  <div id="line12">
    
</div>
  
  <div id="line13">
​
  </div>
  
  <div id="line14">
    
</div>
  
  <div id="line15">
    
</div>
  
  <div id="line16">
    
</div>
​
​
​
</body>
</html>
 
function drawMyLine(lengthLine, color1, color2) {
  var endLine = "<p>";
  for(var i = 0; i <= lengthLine; i++){
    if(i % 2 === 0){
      endLine += "<span style='color:" + color1 + "' 'text:';>*</span>";
      
    }else {
      endLine += "<span style='color:" + color2 + "';>*</span>";
    
      } 
    }
    endLine += "</p>";
  console.log(endLine);
    return endLine;
}
​
​
document.getElementById('line1').innerHTML = drawMyLine(0, 'red', 'blue');
document.getElementById('line2').innerHTML = drawMyLine(1, 'red', 'blue');
document.getElementById('line3').innerHTML = drawMyLine(2, 'red', 'blue');
document.getElementById('line4').innerHTML = drawMyLine(3, 'red', 'blue');
document.getElementById('line5').innerHTML = drawMyLine(4, 'red', 'blue');
document.getElementById('line6').innerHTML = drawMyLine(5, 'red', 'blue');
document.getElementById('line7').innerHTML = drawMyLine(6, 'red', 'blue');
document.getElementById('line8').innerHTML = drawMyLine(7, 'red', 'blue');
 
​
document.getElementById('line9').innerHTML = drawMyLine(7, 'red', 'blue');
document.getElementById('line10').innerHTML = drawMyLine(6, 'red', 'blue');
document.getElementById('line11').innerHTML = drawMyLine(5, 'red', 'blue');
document.getElementById('line12').innerHTML = drawMyLine(4, 'red', 'blue');
document.getElementById('line13').innerHTML = drawMyLine(3, 'red', 'blue');
document.getElementById('line14').innerHTML = drawMyLine(2, 'red', 'blue');
document.getElementById('line15').innerHTML = drawMyLine(1, 'red', 'blue');
document.getElementById('line16').innerHTML = drawMyLine(0, 'red', 'blue');
Output 300px

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

Dismiss x
public
Bin info
alexwastakenpro
0viewers