title: Aframe problems with stereo effect
body: <p>When I test VR mode at Android device(by google cardboard), It seems no stereo effect? The picture in two eyes are different, however when I put my phone into cardboard, they did not match each other, which means the entities overlap, but not come to one integrated stereo things..
  <a href="https://i.stack.imgur.com/mwO4h.jpg" rel="nofollow noreferrer">enter image description here</a></p>
  <p>Here is my source code:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;i3D&lt;/title&gt;
      &lt;meta name="description" content="VRselfWebsite"&gt;
      &lt;script src="js/Aframe/aframe.js"&gt;&lt;/script&gt;
      &lt;script src="js/Aframe/build.js"&gt;&lt;/script&gt;
      &lt;script src="js/Aframe/aframe-animation-component.js"&gt;&lt;/script&gt;
      &lt;script src="js/Aframe/aframe-event-set-component.js"&gt;&lt;/script&gt;
      &lt;script src="https://rawgit.com/ngokevin/aframe-layout-component/master/dist/aframe-layout-component.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://rawgit.com/ngokevin/aframe-template-component/master/dist/aframe-template-component.min.js"&gt;&lt;/script&gt;
      &lt;script src="js/Aframe/set-image.js"&gt;&lt;/script&gt;
      &lt;script src="js/Aframe/update-raycaster.js"&gt;&lt;/script&gt;
      &lt;script src="https://cdn.rawgit.com/AdaRoseEdwards/facetype-fonts-for-a-frame/master/Exo%202_Bold%20Italic.js"&gt;&lt;/script&gt;
  
    &lt;/head&gt;
    &lt;body&gt;
      &lt;a-scene &gt;
        &lt;a-assets&gt;
          &lt;img id="internship" src="img/internship.png"&gt;
          &lt;img id="goggles" src="img/goggles.png"&gt;
          &lt;img id="education" src="img/education.png"&gt;
          &lt;img id="interets" src="img/interets.png"&gt;
          &lt;img id="harry" src="img/harry.jpeg"&gt;
          &lt;img id="gallery" src="img/gallery.png"&gt;
          &lt;img id="hkust" src="img/hkustPanorama.jpg"&gt;
          &lt;img id="mozvr" src="img/mozvr.png"&gt;
          &lt;img id="zy" src="img/zy.jpeg"&gt;
          &lt;img id="trans" src="img/trans.png"&gt;
          &lt;audio id="click-sound" crossorigin="anonymous" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg"&gt;&lt;/audio&gt;
  
        &lt;/a-assets&gt;
  
        
       
  
        &lt;!-- Camera + cursor. --&gt;
        &lt;a-entity camera look-controls&gt;
          &lt;a-cursor id="cursor"
            animation__click="property: scale; startEvents: click; from: 0.1 0.1 0.1; to: 1 1 1; dur: 150"
            animation__fusing="property: fusing; startEvents: fusing; from: 1 1 1; to: 0.1 0.1 0.1; dur: 300"
            event-set__1="_event: mouseenter; color: springgreen"
            event-set__2="_event: mouseleave; color: black"
            raycaster="objects: .link"&gt;&lt;/a-cursor&gt;
        &lt;/a-entity&gt;
  
        
  
  &lt;a-entity position="0 0 -3" rotation="5 0 0" sound="on: click; src: #click-sound"&gt;
      &lt;a-entity id="author"
        position="-.7 0 0.3" text="text: Ariel .Zhang; font: exo 2;  style: italic; size: 0.37; weight: bold; height: 0;" 
        material="shader: flat; color:black;"
       &gt;
        &lt;/a-entity&gt;
  &lt;/a-entity&gt;
  
  
  
         &lt;a-image id="planes" width="7" height="2.7" src="#trans" scale="0.9 0.9 0.9"&gt;
          &lt;a-animation attribute="position" from="0.7 -2 -12" to="0.7 -2 -5" delay="750"
                       dur="1000"&gt;&lt;/a-animation&gt;
        &lt;/a-image&gt;
  
  
        &lt;a-curvedimage id="education-logo" src="#education" radius="5.7" theta-length="36" height="1"
                       position="0 2.6 -1" opacity="0.5" sound="on: click; src: #click-sound"
                       class="link"
                       event-set__1="_event: mousedown; scale: 1 1 1"
                       event-set__2="_event: mouseup; scale: 1.2 1.2 1"
                       event-set__3="_event: mouseenter; scale: 1.2 1.2 1"
                       event-set__4="_event: mouseleave; scale: 1 1 1"
                       set-image="on: click; target: #planes; src: #education"
                       update-raycaster="#cursor"&gt;
          &lt;a-animation attribute="rotation" from="0 10 0" to="0 200 0" delay="500"
                       dur="1000"&gt;&lt;/a-animation&gt;
        &lt;/a-curvedimage&gt;
  
        &lt;a-image id="interets" src="#interets" width="7" height="3.5" scale="0.3 0.3 0.3" sound="on: click; src: #click-sound"
                       class="link"
                       event-set__1="_event: mousedown; scale: 0.3 0.3 0.3"
                       event-set__2="_event: mouseup; scale: 0.4 0.4 0.3"
                       event-set__3="_event: mouseenter; scale: 0.4 0.4 0.3"
                       event-set__4="_event: mouseleave; scale: 0.3 0.3 0.3"
                       set-image="on: click; target: #planes; src: #interets"
                       update-raycaster="#cursor"&gt;
          &lt;a-animation attribute="position" from="0 2.8 -6" to="2.25 2.8 -6" delay="1000"
                       dur="1000"&gt;&lt;/a-animation&gt;
        &lt;/a-image&gt;
  
        &lt;a-cylinder id="goggles" color="#101010" height="0.02" radius="0.8" sound="on: click; src: #click-sound"&gt;
          &lt;a-animation attribute="rotation" from="-270 0 0" to="-90 0 0" dur="750" delay="1000"
                       fill="both"&gt;&lt;/a-animation&gt;
          &lt;a-animation attribute="position" from="8 0 -9" to="8 -3.5 -9" dur="750" delay="1000"
                       fill="both"&gt;&lt;/a-animation&gt;
          &lt;a-image src="#goggles" width="2" height="1" rotation="90 0 0" position="0 -.05 0"
                   scale=".4 .4 .4"&gt;&lt;/a-image&gt;
        &lt;/a-cylinder&gt;
  
  
        &lt;a-curvedimage id="internship" src="#internship" radius="5.7"
                       theta-length="18" height=".45" position="0 -0.05 0" scale=".4 .4 .4" sound="on: click; src: #click-sound"
                       class="link"
                       event-set__1="_event: mousedown; scale: 0.3 0.3 0.3"
                       event-set__2="_event: mouseup; scale: 0.4 0.4 0.3"
                       event-set__3="_event: mouseenter; scale: 0.4 0.4 0.3"
                       event-set__4="_event: mouseleave; scale: 0.3 0.3 0.3"
                       set-image="on: click; target: #planes; src: #internship"
                       update-raycaster="#cursor"&gt;
          &lt;a-animation attribute="rotation" from="0 180 0" to="0 217 0" delay="750"
                       dur="1000"&gt;&lt;/a-animation&gt;
        &lt;/a-curvedimage&gt;
  
  
  
        &lt;a-curvedimage id="gallery" src="#gallery" radius="5.7" theta-length="18" height=".8"
                       position="0.7 0.2 0.3" scale=".5 .5 .5" sound="on: click; src: #click-sound"
                       class="link"
                       event-set__1="_event: mousedown; scale: 0.3 0.3 0.3"
                       event-set__2="_event: mouseup; scale: 0.4 0.4 0.3"
                       event-set__3="_event: mouseenter; scale: 0.4 0.4 0.3"
                       event-set__4="_event: mouseleave; scale: 0.3 0.3 0.3"
                       set-image="on: click; target: #planes; src: #zy"
                       update-raycaster="#cursor"&gt;
          &lt;a-animation attribute="rotation" from="0 180 0" to="0 130 0" delay="750"
                       dur="1000"&gt;&lt;/a-animation&gt;
        &lt;/a-curvedimage&gt;
  
        &lt;a-entity&gt;
          &lt;a-cylinder position="0 0.5 0" radius="4" height="1.6" side="back" open-ended="true"
                      color="#FFF" opacity="0.9"&gt;&lt;/a-cylinder&gt;
        &lt;/a-entity&gt;
  
        &lt;!--&lt;a-sky color="#ECECEC"&gt;&lt;/a-sky&gt;--&gt;
        &lt;a-sky id="hkust-360" radius="10" src="#hkust"&gt;&lt;/a-sky&gt;
  
        &lt;!--&lt;a-light type="directional" color="#fff" intensity="0.2" position="-1 2 1"&gt;&lt;/a-light&gt;
        &lt;a-light type="ambient" color="#fff"&gt;&lt;/a-light&gt;--&gt;
      &lt;/a-scene&gt;
    &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>Thanks in advance!!</p>