JSFiddle

  • Create an Arrow with HTML and CSS

    http://www.ovidiuconeac.ro/2017/10/27/create-an-arrow-with-html-and-css/

    <div class="container">
    
      <div class="box body">
      </div>
      
      <div class="box head">
      </div>
      
    </div>
      
  • ovidiuconeac.ro - #OviCon - VR #8 is the latest revision

    ovidiuconeac.ro - #OviCon - VR

    <script src="https://aframe.io/releases/0.6.1/aframe.min.js"></script>
    
    <a-scene inspector="url: https://aframe.io/releases/0.3.0/aframe-inspector.min.js" stats>
    
      <a-assets>
        <img id="work-in-progress" src="img/work_in_progress.png">
      </a-assets>
    
      <a-camera position="0 0 0">
        <a-cursor id="cursor" color="#FFFFFF" fuse="true" timeout="10">
          <a-animation begin="click" easing="ease-in" attribute="scale" fill="backwards" from="0.1 0.1 0.1" to="1 1 1" dur="150"></a-animation>
          <a-animation begin="cursor-fusing" easing="ease-in" attribute="scale" from="1 1 1" to="0.1 0.1 0.1" dur="1500"></a-animation>
        </a-cursor>
      </a-camera>
    
      <a-light id="light" type="ambient" color="white">
      </a-light>
    
      <a-sky id="sky" color="black">
      </a-sky>
    
      <a-entity id="ground" geometry="primitive: circle; radius: 30.5" material="color: white" rotation="-90 0 0" light="type: point; intensity: 2.0">
      </a-entity>
    
      <a-image src="#work-in-progress" position="0 2 -5" rotation="0 0 0">
      </a-image>
    
      <a-text value="As I see it" color="white" position="-4 4 -5" rotation="0 0 0"></a-text>
    
      <a-text value="Architecture & Design" color="white" position="-2.6 4 -5" rotation="00 0 0"></a-text>
    
      <a-text value="Cheat Sheets" color="white" position="0 4 -5" rotation="0 0 0"></a-text>
    
      <a-text value="Java" color="white" position="1.7 4 -5" rotation="0 0 0"></a-text>
    
      <a-text value="Mobile" color="white" position="2.6 4 -5" rotation="0 0 0"></a-text>
    
      <a-text value="Web" color="white" position="3.7 4 -5" rotation="0 0 0"></a-text>
    
    </a-scene>
    
  • Stack HTML elements with CSS

    http://www.ovidiuconeac.ro/2017/08/23/stack-html-elements-with-css/

    <div class="container">
    
      <div class="layer layer1">
        Layer 1
      </div>
    
      <div class="layer layer2">
        Layer 2
      </div>
    
      <div class="layer layer3">
        Layer 3
      </div>
    
      <div class="layer layer4">
        Layer 4
      </div>
    
    </div>