css - jQuery positioning in internet explorer -


i need put video right in middle (horizontaly) of page, in chrome , firefox works perfect, in internet explorer (ie11) doesnt (it starts bit left).

when resize browser, works fine, though code copy pasted above.

can me?

link example: http://cardio.abcsucces.be/pages/comprendre1.html

code:

jquery    $(document).ready(function() {    var height = $(window).height();    var width = $(window).width();    var logoh = height / 6;    var font = height / 18;    var font1 = font / 3;    var font2 = font / 2;    var containerw = width * 0.7;    var containerh = height * 0.8;    var res1 = 1938 / 1252;    var res2 = containerw / containerh;    var videoh = containerh * 0.87;    var imgh = containerh * 0.129;    var radius = height / 20;    $("h1").css("font-size", font + "px");    $("#title").css("top", font1 + "px");    $("#menu p").css("font-size", font2 + "px");    $("#hand1, #hand2").css("height", logoh + "px");    $("#title, #hand1, #hand2").css("margin-top", font1 + "px");    $("#container").css("max-width", containerw + "px");    $("#container").css("max-height", containerh + "px");    $("video").css("border-radius", radius + "px");    if (res1 > res2) {      $("#container video").css("width", containerw + "px");      $("#container img").css("width", containerw + "px");      if (width > 1024) {        var containerb = $("#container video").width();        var containerm = (width - containerb) / 2;        $("#container").css("width", containerb + "px");        $("#container").css("left", containerm + "px");      }    } else {      $("#container video").css("height", videoh + "px");      $("#container img").css("height", imgh + "px");      if (width > 1024) {        var containerb = $("#container video").width();        var containerm = (width - containerb) / 2;        $("#container").css("width", containerb + "px");        $("#container").css("left", containerm + "px");      }    }      if (width < 1025) {      var font3 = height / 11;      $("#title, #hand1, #hand2").css("margin-top", font3 + "px");    } else {      /* niets */    }    if ($("#video1").height() - 1 > videoh) {      $("#video1").css("border-radius", "0");    } else {      /* niets */    }      $(window).resize(function() {      var height = $(window).height();      var width = $(window).width();      var logoh = height / 6;      var font = height / 18;      var font1 = font / 3;      var font2 = font / 2;      var containerw = width * 0.7;      var containerh = height * 0.8;      var res1 = 1938 / 1252;      var res2 = containerw / containerh;      var videoh = containerh * 0.87;      var imgh = containerh * 0.129;      var radius = height / 20;      $("h1").css("font-size", font + "px");      $("#title").css("top", font1 + "px");      $("#menu p").css("font-size", font2 + "px");      $("#hand1, #hand2").css("height", logoh + "px");      $("#title, #hand1, #hand2").css("margin-top", font1 + "px");      $("#container").css("max-width", containerw + "px");      $("#container").css("max-height", containerh + "px");      $("video").css("border-radius", radius + "px");      if (res1 > res2) {        $("#container video").css("width", containerw + "px");        $("#container img").css("width", containerw + "px");        if (width > 1024) {          var containerb = $("#container video").width();          var containerm = (width - containerb) / 2;          $("#container").css("width", containerb + "px");          $("#container").css("left", containerm + "px");        }      } else {        $("#container video").css("height", videoh + "px");        $("#container img").css("height", imgh + "px");        if (width > 1024) {          var containerb = $("#container video").width();          var containerm = (width - containerb) / 2;          $("#container").css("width", containerb + "px");          $("#container").css("left", containerm + "px");        }      }        if (width < 1025) {        var font3 = height / 11;        $("#title, #hand1, #hand2").css("margin-top", font3 + "px");      } else {        /* niets */      }      if ($("#video1").height() - 1 > videoh) {        $("#video1").css("border-radius", "0");      } else {        /* niets */      }      });  });    $(window).bind('load', function() {    var width = $(window).width();    if (width > 1024) {      var containerb = $("#container video").width();      var containerm = (width - containerb) / 2;      $("#container").css("width", containerb + "px");      $("#container").css("left", containerm + "px");    }      $(window).resize(function() {      var width = $(window).width();      if (width > 1024) {        var containerb = $("#container video").width();        var containerm = (width - containerb) / 2;        $("#container").css("width", containerb + "px");        $("#container").css("left", containerm + "px");      }      });  });
css    * {    margin: 0;    padding: 0;    overflow: hidden;  }  body {    font-family: arial;  }  h1 {    color: #0070c0;    text-align: center;    font-style: italic;  }  font {    color: #ed27b9;  }  #suite {    position: absolute;    width: 6.5%;    right: 2.5%;    bottom: 2.5%;  }  #suite img {    position: relative;    width: 100%;  }  #menu {    position: absolute;    background-image: url("../beelden/postit.png");    background-repeat: no-repeat;    background-size: 100% 100%;    width: 12%;    left: 1%;    bottom: 1%;    transform: rotate(-7deg);    -o-transform: rotate(-7deg);    -ms-transform: rotate(-7deg);    -moz-transform: rotate(-7deg);    -webkit-transform: rotate(-7deg);  }  #menu p {    position: relative;    padding: 27% 20% 35% 20%;    text-align: center;    color: black;    display: block;    -moz-text-decoration-color: black;    -webkit-text-decoration-color: black;    -moz-text-decoration-color: black;    text-decoration-color: black;    text-decoration: underline;    font-family: comic sans ms;    font-weight: normal;  }  #hand1 {    position: absolute;    left: 0;  }  #title {    position: absolute;    width: 100%;  }  #hand2 {    position: absolute;    right: 0;  }  #container {    position: absolute;    bottom: 0;  }  @media screen , (max-width: 1024px) {    #menu {      width: 13%;    }    #suite {      right: 2%;      bottom: 1%;      width: 8%;    }    #container {      left: 154px;    }  }
html    <head>    <meta charset="utf-8" />    <meta name="viewport" content="width=device-width, initial-scale=1.0" />    <title>un accident cardiaque ? rencontrez votre jumeau</title>    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>  </head>    <body>    <img id="hand1" src="../beelden/hand1.png">    <h1 id="title">un accident cardiaque...<br><font>je veux comprendre !</font></h1>    <img id="hand2" src="../beelden/hand2.png">    <div id="container">      <video id="video1" frameborder="0" poster="../beelden/film2.png" preload="none" webkitallowfullscreen mozallowfullscreen allowfullscreen controls>        <source src="../video/film2.mp4" type="video/mp4">          <source src="../video/film2.ogg" type="video/ogg">            <source src="../video/film2.webm" type="video/webm">              browser not support video tag      </video>      <img src="../beelden/reflectie2.png">    </div>    <a id="menu" href="menu.html">      <p>        menu        <br>principal      </p>    </a>    <a id="suite" href="comprendre2.html">      <img src="../beelden/suite.png">    </a>  </body>


Comments

Post a Comment

Popular posts from this blog

javascript - Google App Script ContentService downloadAsFile not working -

i have web app developed using google app script htmlservice , html form, populating excel sheet in google drive using spreadsheetapp . , 1 section calling contentservice download data excel file. function doget(e) { // read excel sheet //getappfile(); // render application html template return htmlservice.createtemplatefromfile('index').evaluate() .settitle('go smart') .setsandboxmode(htmlservice.sandboxmode.iframe); } function downloaddoublequatecsvfile() { var sheetid = propertiesservice.getscriptproperties().getproperty('sheetid'); var ss = spreadsheetapp.openbyid(sheetid).getactivesheet(); //var ss = spreadsheetapp.getactivespreadsheet().getactivesheet(); var maxcolumn = ss.getlastcolumn(); var maxrow = ss.getlastrow(); var data = ss.getrange(1, 1, maxrow, maxcolumn).getvalues(); if (data.length > 1) { var csv = ""; (var row = 0; row < data.length; row++) { (var c...
Read more

javascript - Function overwritting -

is there way overwrite function or event handling in function? using addeventlistener, can have many event handlers on element want var test=document.getelementbyid("div"); test.addeventlistener("click",function(){alert("im first");},false); test.addeventlistener("click",function(){alert("im second");},false); // alerts "im first" , after "im second" but if want overwrite function/event example based on client width example this function one() { alert("first"); } function two() { alert("second"); } window.onresize = function() { var test = document.getelementbyid("div"); if (window.innerwidth > 500) { test.onclick = 1 } else { test.onclick = two; } } is possible in javascript? in case use effective little known approach. addeventlistener can accept object property handleevent event handler. in case it's easy overwr...
Read more

php - Find a regex to take part of Email -

i have following emails need extract part from: bestellnummer xxx: 1 von xxx, 1er pack ------------- anfang der nachricht ------------- foo bar baz foo bar baz // <<<<< need text here ------------- ende der nachricht ------------- ------------- anfang der nachricht ------------- foo bar baz foo bar baz ------------- ende der nachricht ------------- there 0 unlimited occurences of ------------- anfang der nachricht ------------- ------------- ende der nachricht ------------- and i'm able extract first part regex: $re = "/------------- .*? -------------.?(.*?).?------------- .*? -------------/s"; but, i'm quite new on learning regex, i'm pretty sure there must better regex extract part (foo bar baz foo bar baz) of text between ------------- anfang der nachricht ------------- ------------- ende der nachricht ------------- as can in different languages, i'm using .? to match between hyphens. i...
Read more