Diskuze: Různé chování na různých prohlížečích

Naučíme tě pracovat na home-office.
Zjistit více...
V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.
Aktivity
ostrozan
Tvůrce
ostrozan:12.4.2016 11:14
Můžete prosím někdo nahlédnout do kódu - mám tam nějakou chybu, která se projevuje tak, že stránka se načte tak jak má jen v Maxthonu - ostatní (Opera,Firefox,IE,Chrome) s ní mají problém viz:
http://www.jpeg.cz/…12/SCMkg.jpg
http://www.jpeg.cz/…12/LMwtc.jpg
http://www.jpeg.cz/…12/XfJos.jpg
http://www.jpeg.cz/…12/ZXc61.jpg
http://www.jpeg.cz/…12/3Bpaz.jpg
problém je vázaný u Chrome a Opery na rychlost načítání stránky - když ji načtu z karty přímo v PC, tak je to v pohodě - já ji ale potřebuju načítat z přes ethernet z karty v arduinu - a to je strašně pomalé
v IE a Firefoxu to nefunguje ani tak
<!DOCTYPE html>
<html lang="cs-cz">



<head>
<meta charset="utf-8" />
<title>Týdenní termostat</title>
<script>



    function InputInit()
        {
                var inputs= document.querySelectorAll('input[type=number]');

                for (var i = 0; i<inputs.length; i++)
                        {
                        inputs[i].min=15;
                        inputs[i].max=25;
                        inputs[i].step=0.5;
                        }
        }

        var responseMsg=" ";
        var reload = false;
        window.onload = GetArduinoValues;

        function GetArduinoValues()
                {
                        nocache = "&nocache=" + Math.random() * 1000000;
                        var request = new XMLHttpRequest();
                        request.onreadystatechange = function()
                        {
                                if (this.readyState == 4) {
                                        if (this.status == 200) {
                                            if (this.responseXML != null)
                            {
                                                var page = this.responseXML.getElementsByTagName('stranka')[0].childNodes[0].nodeValue;
                                                if (page === "val") location.reload(true);

                            //*/pondeli
                                                GetRespValues('temp1', "temp1", 'time1', "time1", this.responseXML);
                                                //utery
                                                GetRespValues('temp2', "temp2", 'time2', "time2", this.responseXML);
                                                //streda
                                                GetRespValues('temp3', "temp3", 'time3', "time3", this.responseXML);
                                                //ctvrtek
                                                GetRespValues('temp4', "temp4", 'time4', "time4", this.responseXML);
                                                //patek
                                                GetRespValues('temp5', "temp5", 'time5', "time5", this.responseXML);
                                                //sobota
                                                GetRespValues('temp6', "temp6", 'time6', "time6", this.responseXML);
                                                //nedele
                                                GetRespValues('temp7', "temp7", 'time7', "time7", this.responseXML);
                            // */
                                                }
                                        }
                                }
                        }
                        // send HTTP GET request

                    request.open("GET", "ajax_values" + responseMsg + nocache, true);
                        request.send();
                        responseMsg = "";
                        if (reload) {
                            reload = false;
                        }

   }
            //zprava +priznak pro reload
                        function GoVal()
                        {
                            responseMsg="&valPage";
                            reload = true;
                            GetArduinoValues();

                        }

            //vytahne hodnoty y XMLdokumentu
                        function GetRespValues(tagTemp,classTemp,tagTime,classTime,resp)
                        {
                            var count;
                            var num_elements = resp.getElementsByTagName(tagTemp).length;
                            for (count = 0; count < num_elements; count++)
                            {
                                document.getElementsByClassName(classTemp)[count].value =
                        resp.getElementsByTagName(tagTemp)[count].childNodes[0].nodeValue;
                            }

                            num_elements = resp.getElementsByTagName(tagTime).length;
                            for (count = 0; count < num_elements; count++)
                            {
                                document.getElementsByClassName(classTime)[count].value =
                        resp.getElementsByTagName(tagTime)[count].childNodes[0].nodeValue;
                            }
                        }



</script>

<style>

.CSSTable {
        float: left;
        margin:5px;padding:0px;
        width:170px;
        box-shadow: 8px 8px 4px #888888;
        border:1px solid #000000;


}.CSSTable table{
    border-collapse: collapse;
    border-spacing: 0;
        width:100%;
        height:100%;
        margin:0px;
        padding:0px;

}.CSSTable tr:hover td{
        background-color:#FFA500;

}.CSSTable caption {
        background-color: #5BA7ED;

}.CSSTable input{
    display:normal;
    width:95%;
    margin-left:auto;
    margin-right:auto;

}.CSSTable td{
        vertical-align:middle;
        background:-o-linear-gradient(bottom, #aad4ff 5%, #ffffff 100%);
        background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #aad4ff), color-stop(1, #ffffff) );
        background:-moz-linear-gradient( center top, #aad4ff 5%, #ffffff 100% );
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#aad4ff", endColorstr="#ffffff");
        background: -o-linear-gradient(top,#aad4ff,ffffff);

        background-color:#aad4ff;
    width:50%;
        border:1px solid #000000;
        border-width:0px 1px 1px 0px;
        text-align:left;
        padding:2px;
        font-size:10px;
        font-family:Arial;
        font-weight:normal;
        color:#000000;

}.CSSTable tr:last-child td{
        border-width:0px 1px 0px 0px;
}.CSSTable tr td:last-child{
        border-width:0px 0px 1px 0px;
}.CSSTable tr:last-child td:last-child{
        border-width:0px 0px 0px 0px;
}
.CSSTable tr:first-child td{
    background:-o-linear-gradient(bottom, #005fbf 5%, #003f7f 100%);    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #003f7f) );
        background:-moz-linear-gradient( center top, #005fbf 5%, #003f7f 100% );
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#003f7f");      background: -o-linear-gradient(top,#005fbf,003f7f);

        background-color:#005fbf;
        border:0px solid #000000;
        text-align:center;
        border-width:0px 0px 1px 1px;
        font-size:14px;
        font-family:Arial;
        font-weight:bold;
        color:#ffffff;
}
.CSSTable tr:first-child:hover td{
        background:-o-linear-gradient(bottom, #005fbf 5%, #003f7f 100%);        background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #003f7f) );
        background:-moz-linear-gradient( center top, #005fbf 5%, #003f7f 100% );
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#003f7f");      background: -o-linear-gradient(top,#005fbf,003f7f);

        background-color:#005fbf;
}
.CSSTable tr:first-child td:first-child{
        border-width:0px 0px 1px 0px;
}
.CSSTable tr:first-child td:last-child{
        border-width:0px 0px 1px 1px;
}


</style>
</head>

<body onload="InputInit()">
<div class="CSSTable" >
                <table >
                                        <caption>pondělí</caption>
                    <tr>
                        <td>
                            čas
                        </td>
                        <td >
                            teplota
                        </td>

                    </tr>
                    <tr>
                                                <td><input class="time1" type="time"></td>
                        <td><input class="temp1" type="number" max=25 ></td>

                    </tr>
                    <tr>
                                                <td><input class="time1" type="time"></td>
                        <td><input class="temp1" type="number" max=25 ></td>
                    </tr>
                    <tr>
                                                <td><input class="time1" type="time"></td>
                        <td><input class="temp1" type="number" max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time1" type="time"></td>
                        <td><input class="temp1" type="number" max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time1" type="time"></td>
                        <td><input class="temp1" type="number" max=30></td>
                    </tr>
                </table>
            </div>
            <div class="CSSTable" >
                                <table >
                <caption>úterý</caption>
                    <tr>
                        <td>
                            čas
                        </td>
                        <td >
                            teplota
                        </td>

                    </tr>
                    <tr>
                                                <td><input class="time2" type="time"></td>
                        <td><input class="temp2" type="number" max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time2" type="time"></td>
                        <td><input class="temp2" type="number" max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time2" type="time"></td>
                        <td><input class="temp2" type="number" max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time2" type="time"></td>
                        <td><input class="temp2" type="number" max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time2" type="time"></td>
                        <td><input class="temp2" type="number" max=25></td>
                    </tr>
                </table>
            </div>
            <div class="CSSTable" >
                <table >
                                        <caption>středa</caption>
                    <tr>
                        <td>
                            čas
                        </td>
                        <td >
                            teplota
                        </td>

                    </tr>
                    <tr>
                                                <td><input class="time3" type="time"></td>
                        <td><input class="temp3" type="number" max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time3" type="time"></td>
                        <td><input class="temp3" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time3" type="time"></td>
                        <td><input class="temp3" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time3" type="time"></td>
                        <td><input class="temp3" type="number" max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time3" type="time"></td>
                        <td><input class="temp3" type="number" max=25></td>
                    </tr>
                </table>
            </div>
            <div class="CSSTable" >
                <table >
                                        <caption>čtvrtek</caption>
                    <tr>
                        <td>
                            čas
                        </td>
                        <td >
                            teplota
                        </td>

                    </tr>
                    <tr>
                                                <td><input class="time4" type="time"></td>
                        <td><input class="temp4" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time4"  type="time"></td>
                        <td><input class="temp4" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time4"  type="time"></td>
                        <td><input class="temp4" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time4"  type="time"></td>
                        <td><input class="temp4" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time4"  type="time"></td>
                        <td><input class="temp4" type="number"  max=25></td>
                    </tr>
                </table>
            </div>
            <div class="CSSTable" >
                <table >
                                        <caption>pátek</caption>
                    <tr>
                        <td>
                            čas
                        </td>
                        <td >
                            teplota
                        </td>

                    </tr>
                    <tr>
                                                <td><input class="time5"  type="time"></td>
                        <td><input class="temp5" type="number" max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time5" type="time"></td>
                        <td><input class="temp5" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time5" type="time"></td>
                        <td><input class="temp5" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time5" type="time"></td>
                        <td><input class="temp5" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time5" type="time"></td>
                        <td><input class="temp5" type="number"  max=25></td>
                    </tr>
                </table>
            </div>
            <div class="CSSTable" >
                <table >
                                        <caption>sobota</caption>
                    <tr>
                        <td>
                            čas
                        </td>
                        <td >
                            teplota
                        </td>

                    </tr>
                    <tr>
                                                <td><input class="time6" type="time"></td>
                        <td><input class="temp6" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time6" type="time"></td>
                        <td><input class="temp6" type="number"  max=25 ></td>
                    </tr>
                    <tr>
                                                <td><input class="time6" type="time"></td>
                        <td><input class="temp6" type="number"  max=25 ></td>
                    </tr>
                    <tr>
                                                <td><input class="time6" type="time"></td>
                        <td><input class="temp6" type="number"  max=25 ></td>
                    </tr>
                    <tr>
                                                <td><input class="time6" type="time"></td>
                        <td><input class="temp6" type="number"  max=25 ></td>
                    </tr>
                </table>
            </div>
            <div class="CSSTable" >
                <table >
                                        <caption>neděle</caption>
                    <tr>
                        <td>
                            čas
                        </td>
                        <td >
                            teplota
                        </td>

                    </tr>
                    <tr>
                                                <td><input class="time7" type="time"></td>
                        <td><input class="temp7" type="number"  max=25 ></td>
                    </tr>
                    <tr>
                                                <td><input class="time7" type="time"></td>
                        <td><input class="temp7" type="number"  max=25></td>
                    </tr>
                    <tr>
                                                <td><input class="time7" type="time"></td>
                        <td><input class="temp7" type="number"  max=25 ></td>
                    </tr>
                    <tr>
                                                <td><input class="time7" type="time"></td>
                        <td><input class="temp7" type="number" max=25 ></td>
                    </tr>
                    <tr>
                                                <td><input class="time7" type="time"></td>
                        <td><input class="temp7" type="number"  max=25 ></td>
                    </tr>
                </table>
            </div>

    <div>
        <button type="button" id="buttGoVal" onclick="GoVal()">Zpět</button><br /><br />

    </div>
</body>

</html>
Editováno 12.4.2016 11:15
Odpovědět
12.4.2016 11:14
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.
Zobrazeno 1 zpráv z 1.
Nejčastěji vyhledáváné

Diskuze: Různé chování na různých prohlížečích
