BBM-Repeater 1.03

by velo_ninja

HTML

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>xxxxxx</title>
    
    <style>
      ::-webkit-scrollbar {width: 1px;} /* HIDING SCROLLBAR IN CHROME */
      
      body {
        margin: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 98vw;
        height: 100vh;
        background-color: lightgrey;
        overflow: hidden;
      }
    </style>
    
    
    <script>
    	//---------- [ CREATE-DIV ] -------------------------------
        function create_div(opt) {const div = document.createElement('div');
          Object.keys(opt).forEach(key => {div.style[key] = opt[key];});
          return div;
        }
      	//---------- [ CREATE-REPEATER ] -------------------------------
        function create_Repeater(dataArray, divMain){let counter = 1; 
          dataArray.forEach((item, index) => {
            let divString, divNumber, divBoolean;
            //-------------------------------------------------------------------------
            let divItem = create_div(optDivItem); 
            //--------------------------------
            let divStringCreated = false;
            let divNumberCreated = false;
            let divBooleanCreated = false;            
            //-------------------------------------------------------------------------       
            let divCounter = create_div(optDivCounter); divItem.appendChild(divCounter);             
            let divImage = create_div(optDivImage); 		divItem.appendChild(divImage); 
            //-------------------------------------
            for (const key in item) {                
              const divDataHolder = create_div(optDataHolder);
              const divKey = create_div(optDivKey);
              const divValue = create_div(optDivValue);  

              if (key !== '_online' 
                  && key !== '_id' && key !==...

JavaScript

const opt = {
  id:'',
  classList:'',
  //-----------------
  width:'',
  height:'', 
  //minWidth:'',
  //minHeight:'',
  //maxWidth:'',
  //maxHeight:'',
  //-----------------
  //top:'',
  //bottom:'',
  //left:'',
  //right:'',
  //-----------------
  margin:'',
  padding:'',
  //-----------------
  color:'',
  background:'',
  //-----------------
  border:'',
  borderRadius:'',
  //-----------------
  position:'',
  display:'',   
  alignItems:'',
  justifyContent:'',
  flexDirection:'',
  //----------------- 
  transition:'',
  transform:'',
  cursor:'',
  overflow:'',
  //-----------------
};