Javascript nie działa poprawnie

Wszystko związane ze skryptami JS, DHTML itd.
pipetachemlab
Posty: 3
Rejestracja: 30 sty 2015, 21:59:48
Płeć: Niewybrana
User Agent: Chrome Windows

Javascript nie działa poprawnie

Post autor: pipetachemlab »

Witam wszystkich! Napisałem prostą galerię w javascript (około 90%) reszta to html -głównie przyciski oraz divy. Wszystko napisałem na swoim kompie wrzuciłem na serwer i... przestało częściowo działać. Pal cześć, że wolno się ładuje. Niektóre funkcje (ustalanie stylu display:none nie) nie chcą działać. Dodam, że na tej samej przeglądarce wszystko było testowane. Dlaczego ? :crazy:
4zywioly
Posty: 528
Rejestracja: 26 kwie 2011, 16:33:42
Strona na CBA.pl: 4zywioly.c0.pl
Płeć: Niewybrana
User Agent: Chrome Windows 1366x768
Kontakt:

Re: Javascript nie działa poprawnie

Post autor: 4zywioly »

Korzystasz z jakiś bibliotek? Może ich nie dołączyłeś?
pipetachemlab
Posty: 3
Rejestracja: 30 sty 2015, 21:59:48
Płeć: Niewybrana
User Agent: Chrome Windows

Re: Javascript nie działa poprawnie

Post autor: pipetachemlab »

nie nie, iwyłącznie operacje na pokazywaniu i "znikaniu" elementów document.getElementById('element').style.display ="none"; na przykład. :?
4zywioly
Posty: 528
Rejestracja: 26 kwie 2011, 16:33:42
Strona na CBA.pl: 4zywioly.c0.pl
Płeć: Niewybrana
User Agent: Chrome Windows 1366x768
Kontakt:

Re: Javascript nie działa poprawnie

Post autor: 4zywioly »

daj jakąś próbkę kodu :)
pipetachemlab
Posty: 3
Rejestracja: 30 sty 2015, 21:59:48
Płeć: Niewybrana
User Agent: Chrome Windows

Re: Javascript nie działa poprawnie

Post autor: pipetachemlab »

Kod: Zaznacz cały

<!-- Copyright by CompaqChemLab. 12.09.2015 created with notepad++ -->
<html>
    <head>
        <meta charset="UTF-8">
        <title>
            Koszulki CompaqChemLab
        </title>
        <script type="text/javascript">
        var intX = 0;
        const jump=5; //przeskocz o n zdjęć (dla wygody również ilość klatek na divie) 5 to max dla foto o podanych wymiarach!
        const CntrColor="white"; //domyślny kolor licznika (numeracja zdjęć)
        var allIMG;
            function BOOT(){
                            ChangeCNTRcolor(CntrColor);
                            licz();
                            wprawo();
                            wlewo(); //reset ustawień
                            document.getElementById("alert").style.display = "none"; //gdy klient obsługuje javascript, ukryj alert
                            document.getElementById("napis").style.display = "";
                            if (jump != 5){
                            for (int4 = 0; int4 < jump+1; int4++){
                                                              document.getElementsByClassName("counterX")[int4].style.display = "none";
                                                                 }
                                          }
                          } 
            function licz(){ //liczy ile jest elementów z klasą imgX
                             var obrazki = document.getElementsByClassName("imgX");
                             allIMG = (obrazki.length);
                           }
            function ChangeCNTRcolor(CounterColor){
                            var CCounters = document.getElementsByClassName("counterX");
            
                            for (int5 = 0; int5 < CCounters.length; int5++){
                                                                            document.getElementsByClassName("counterX")[int5].style.color = CounterColor;
                                                                           }
                                                  }
            function ImageError(TElement){
                                    document.getElementById(TElement).src = "nopicture.png";
                                         }
            function rff(zwrot){ //przewiń do końca
                             if (zwrot==1){
                                          intX = (allIMG - jump); //przeskocz do końca
                                          hiddenall();
                                          showIMG();
                                          ShowInfo();
                                          }
                             if (zwrot==0){
                                          intX = 0; //przeskocz na początek
                                          hiddenall();
                                          showIMG();
                                          ShowInfo();
                                          }                           
                            }
            function ShowInfo(){
                              if (jump > 1){
                                        document.getElementById("labelX1").innerHTML = (intX+1) + "-" + (intX + jump) + "/" + allIMG;
                                        for (int3 = 1; int3 < jump+1; int3++){
                                    
                                                               document.getElementById("labX"+int3).innerHTML = (intX + int3);

                                                                        }
                                         }
                                         dodajopis();
                               }
            function upImgBox(){
                                document.getElementById("ImgBOX").style.top =1;
                                document.getElementById("up").style.display ="none";
                                document.getElementById("down").style.display ="";
                               }
            function dodajopis(){
                                if (intX == (0*jump)){document.getElementById("opis").innerHTML ="<center><b>I ♥ Chemia</b></center><br> Wspaniała koszulka.<br> Spolszczony napis 'chemia' pozwala, by wszyscy zrozumieli napis. Pierwsza koszulka, jaką stworzyłem.";}
                                if (intX == (1*jump)){document.getElementById("opis").innerHTML ="<center><b>Brak opisu kolekcji</b></center><br>";}
                                if (intX == (2*jump)){document.getElementById("opis").innerHTML ="<center><b>Brak opisu kolekcji</b></center><br>";}
                                if (intX == (3*jump)){document.getElementById("opis").innerHTML ="<center><b>Brak opisu kolekcji</b></center><br>";}
                                if (intX == (4*jump)){document.getElementById("opis").innerHTML ="<center><b>Brak opisu kolekcji</b></center><br>";}
                                }
            function downImgBox(){
                                document.getElementById("ImgBOX").style.top =158;
                                document.getElementById("down").style.display ="none";
                                document.getElementById("up").style.display ="";
                                 }
            function showIMG(){
            for (int2 = 0; int2 < jump; int2++){ 
                                                
                             document.getElementsByClassName("imgX")[(intX+int2)].style.display ="";
                                               }
                              }
            function showImgBox(foto){
                                    document.getElementById("ImgBOX").style.display ="";
                                    document.getElementById("ActiveIMG").src= foto;
                                    document.getElementById("napis").style.display ="none";
                                     }
            function HideImgBox(){
                                    document.getElementById("ImgBOX").style.display ="NONE";
                                    document.getElementById("napis").style.display ="";
                                 }
            function hiddenall(){
            var elm=document.getElementsByClassName("imgX");
            for (int1 = 0; int1 < elm.length; int1++) 
                         {
    elm[int1].style.display ="none";
                         }
                                }                           
            function wprawo(){
                if (intX < (allIMG - jump)){
                                        intX = intX + jump; 
                                        hiddenall();
                                        showIMG();
                                        ShowInfo();
                                       }
                             }                         
            function wlewo(){
                            if (intX > 0){
                            intX=intX - jump;
                            hiddenall();
                            showIMG();
                            ShowInfo();
                                        }
                            }                         
        </script>
    </head>
    <body onload="BOOT();">
    <div id="fotoX" style="background-color: #bbb; width: 100%; height: 150;">
<button id="button1" style="font-size: 40; position: absolute; top: 60;" onclick="wlewo();"><</button>
    <center>
<div style="height: 150; width: 1040;">
<img class="imgX" id="A1" style="width: 200; height: 150;" onclick="showImgBox('A1.jpg');" onerror="ImageError('A1')" src="A1.jpg" />
<img class="imgX" id="A2" style="width: 200; height: 150;" onclick="showImgBox('A2.jpg');" onerror="ImageError('A2')" src="A2.jpg" />
<img class="imgX" id="A3" style="width: 200; height: 150;" onclick="showImgBox('A3.jpg');" onerror="ImageError('A3')" src="A3.jpg" />
<img class="imgX" id="A4" style="width: 200; height: 150;" onclick="showImgBox('A4.jpg');" onerror="ImageError('A4')" src="A4.jpg"  />
<img class="imgX" id="A5" style="width: 200; height: 150;" onclick="showImgBox('A5.jpg');" onerror="ImageError('A5')" src="A5.jpg" />
<img class="imgX" id="A6" style="width: 200; height: 150;" onclick="showImgBox('A6.jpg');" onerror="ImageError('A6')" src="A6.jpg" />
<img class="imgX" id="A7" style="width: 200; height: 150;" onclick="showImgBox('A7.jpg');" onerror="ImageError('A7')" src="A7.jpg" />
<img class="imgX" id="A8" style="width: 200; height: 150;" onclick="showImgBox('A8.jpg');" onerror="ImageError('A8')" src="A8.jpg" />
<img class="imgX" id="A9" style="width: 200; height: 150;" onclick="showImgBox('A9.jpg');" onerror="ImageError('A9')" src="A9.jpg" />
<img class="imgX" id="A10" style="width: 200; height: 150;" onclick="showImgBox('A10.jpg');" onerror="ImageError('A10')" src="A10.jpg" />
<img class="imgX" id="A11" style="width: 200; height: 150;" onclick="showImgBox('A11.jpg');" onerror="ImageError('A11')" src="A11.jpg" />
<img class="imgX" id="A12" style="width: 200; height: 150;" onclick="showImgBox('A12.jpg');" onerror="ImageError('A12')" src="A12.jpg" />
<img class="imgX" id="A13" style="width: 200; height: 150;" onclick="showImgBox('A13.jpg');" onerror="ImageError('A13')" src="A13.jpg" /> 
<img class="imgX" id="A14" style="width: 200; height: 150;" onclick="showImgBox('A14.jpg');" onerror="ImageError('A14')" src="A14.jpg" /> 
<img class="imgX" id="A15" style="width: 200; height: 150;" onclick="showImgBox('A15.jpg');" onerror="ImageError('A15')" src="A15.jpg" /> 
<img class="imgX" id="A16" style="width: 200; height: 150;" onclick="showImgBox('A16.jpg');" onerror="ImageError('A16')" src="A16.jpg" /> 
<img class="imgX" id="A17" style="width: 200; height: 150;" onclick="showImgBox('A17.jpg');" onerror="ImageError('A17')" src="A17.jpg" /> 
<img class="imgX" id="A18" style="width: 200; height: 150;" onclick="showImgBox('A18.jpg');" onerror="ImageError('A18')" src="A18.jpg" /> 
<img class="imgX" id="A19" style="width: 200; height: 150;" onclick="showImgBox('A19.jpg');" onerror="ImageError('A19')" src="A19.jpg" /> 
<img class="imgX" id="A20" style="width: 200; height: 150;" onclick="showImgBox('A20.jpg');" onerror="ImageError('A20')" src="A20.jpg" />
<div id="labX1" class="counterX" style="position: absolute; font-size: 30; color: white; top:130; left: 220;">1</div>
<div id="labX2" class="counterX" style="position: absolute; font-size: 30; color: white; top:130; left: 425;">2</div>
<div id="labX3" class="counterX" style="position: absolute; font-size: 30; color: white; top:130; left: 630;">3</div>
<div id="labX4" class="counterX" style="position: absolute; font-size: 30; color: white; top:130; left: 835;">4</div>
<div id="labX5" class="counterX" style="position: absolute; font-size: 30; color: white; top:130; left: 1040;">5</div>
</div>
</center><button id="button2" style="font-size: 40; position: absolute; top: 60; left: 96.3%;" onclick="wprawo();">></button></div>
<div style="background-color: rgba(0, 0, 255, 0.2); width: 98.78%; position: absolute;">
<center>
<button id="button0" onclick="rff(0);">|<</button>
<button id="button1" onclick="wlewo();"><</button>
<label id="labelX1" style="font-size: 30;">n</label>
<button id="button2" style="positin: absolute;" onclick="wprawo();">></button>
<button id="button3" onclick="rff(1);">>|</button>
</center>
</div>
<div id="napis" style="position: relative; top: +10; font-size: 20; display: none; background-color: rgba(0, 255, 0, 0.2);"><center>
<h2>Witamy w galerii koszulek CompaqChemLab!</h2>
</center>
Znajdziesz tu mnóstwo wzorów! Wszystkie koszulki są robione ręcznie jedną z dwóch metod :
<br />
a) Nanoszenie mazakami do tekstyliów.
<br />
b) Nanoszenie farbki do tekstyliów.
<br /> 
Zaletą metody 1 jest tworzenie cienkich śladów oraz giętkść materiału w miejscu druku.
<br /> 
Metodę 2 stosuje się wszędzie tam, gdzie zależy nam na bardzo dużej trwałości napisów
<br /> 
oraz gdy powierzchnia jest stosunkwo duża. Powierzchnia jest tylko lekko sztywna.
<br /> 
Całe projektowanie zaczyna się od pomysłu. Potem trzeba zrobić projekt w gimpie,
<br /> 
wydrukować szablon i nanieść nadruk na koszulkę wcześniej zakupioną.
<br /> 
Przecież życie było by zbyt piękne, gdyby było by to takie łatwe! Oczywiście, tak bywa!
<br /> 
Uzyskać dobry projekt, nie jest łatwo. Czasami jest to spontaniczne, czasami trwa to tygodniami.
<br /> 
Jeśli masz więc tylko pomysł, to <B>pisz!</b> zrób projekt w gimpie w formacie A4 (poziomo) i wyślij na moją pocztę.
<br /> 
Z pewnością to docenię. :D <B>Pamiętaj!</b> Wulgarne napisy wcale nie są zabawne i na 100% nie przejdą moderacji.
<br />
Pozdrawiam, CompaqChemLab
<img class="imaX" style="width: 200; height: 150; position: absolute; top: -10; left: 1000;" src="this.png" />
<div id="opis" style="background-color: RGBA(0, 0, 255, 0.2); position: absolute; top: 150; left: 1000; height: 200;">Opis dotyczący kolekcji : </div>
</div>
<div id="ImgBOX" style="background-color: rgba(0, 128, 255, 0.5); width: 100%; height: 100%; position: absolute; display: none;">
<center>
<img id="ActiveIMG" style="width: 667; height: 500;" /> <!-- w width powinno wyjść 666, ale dla przesądu +1 dałem :D-->
<button style="font-size: 30; position: relative; top: -470; left: -4; height: 37;" onclick="HideImgBox();">X</button>
<button id="up" style="font-size: 28; position: relative; top: -472; left: -8; height: 37;" onclick="upImgBox();">▲</button>
<button id="down" style="font-size: 28; position: relative; top: -472; left: -8; height: 37; display: none;" onclick="downImgBox();">▼</button>
</center>
</div>
<div id="alert" style="background-color: #0080ff; width: 100%; height: 50%; position: absolute;">
<center>
<h1>Loading...</h1>
Jeśli wiadomość ta nie zniknie, to oznacza, że twoja przeglądarka nie obsługuje javascript!
</center>
</div>
</body>
</html>
<!--
<?PHP
$FFoto = 0;
$FFind //znalezione piliki z rozszeżeniem jpg, jpeg, bmp, gif, png
for ($FFoto < FFind) {
echo "<img class='imgX' id='A" . $FFind . "' style='width: 200; height: 150; onclick='showImgBox(A" . $FFind . ".jpg');' onerror='ImageError('A" . $FFind . "')' src='A" . $FFind . ".jpg' />";
}
 
---- EDIT ----

Miłego analizowania kodu :roll: . To jest cały, oryginalny kod.
lilanisi
Posty: 1
Rejestracja: 03 wrz 2017, 17:15:15
Płeć: Niewybrana
User Agent: Chrome Windows 1680x1050

Javascript nie działa poprawnie

Post autor: lilanisi »

:mrgreen: :evil:
spaceangel333
Posty: 4
Rejestracja: 26 lut 2015, 21:26:10
Płeć: Niewybrana
User Agent: Firefox Windows 1920x1080

Javascript nie działa poprawnie

Post autor: spaceangel333 »

SRC obrazków?
kamil908te
Posty: 4
Rejestracja: 14 maja 2018, 10:14:30
Płeć: Niewybrana
User Agent: Chrome Windows 1280x1024
Kontakt:

Javascript nie działa poprawnie

Post autor: kamil908te »

Tak niekiedy bywa z JavaScript że nie działa
nelneca
Posty: 1
Rejestracja: 19 sty 2019, 15:19:29
Płeć: Niewybrana
User Agent: Chrome Windows 2560x1440

Javascript nie działa poprawnie

Post autor: nelneca »

:mrgreen:
ODPOWIEDZ