title: Javascript Texture Loading for OpenGL, relative path not working
body: <p>I have a webgl application, where I am loading textures like this:</p>
  
  <pre><code>var Texture2D = function(gl, mediaFileUrl) {
    mediaFileUrl = "../" + mediaFileUrl; //This is the line which not works
    this.mediaFileUrl = mediaFileUrl;
    this.glTexture = gl.createTexture();
    this.image = new Image();
    var theTexture = this;
    this.image.onload = function() { theTexture.loaded(gl); } // Never gets called
    this.image.src = mediaFileUrl;
  };
  </code></pre>
  
  <p>If I have the textures in the parent directory somewhere in the file system, it does not work, but if I have my file in one of the child directories ( So not using ../) it works.</p>
  
  <p>File structure looks like this
  [index.html - texture.png] - Same folder = works</p>
  
  <p>[index.html - ../texture.png] - Parent dir = not works</p>
  
  <p>Any ideas how to solve this?</p>
  
  <p>Update: It now works on chrome, but not in Firefox, which is very strange. In Firefox if I turn on the "anonymous" flag (image.crossOrigin = "anonymous") , it cannot load the image, if I turn off then I get a security error.
  (Error: WebGL warning: texImage2D: Cross-origin elements require CORS)</p>