Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów
[JS]Przycisk wyłączający skrypt - Wersja do druku

+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: [JS]Przycisk wyłączający skrypt (/thread-js-przycisk-wylaczajacy-skrypt)

Strony: 1 2


[JS]Przycisk wyłączający skrypt - Ratatuj1995 - 15-12-2010

Elo, zrobiłem sobie spadające elementy na stronie z tego poradnika

Cytat:////////////////////////////////////////////////////////////////
// Javascript made by Rasmus - http://www.peters1.dk //
////////////////////////////////////////////////////////////////

var SNOW_Picture = "link do spadającego elementu"
var SNOW_no = 15;

var SNOW_browser_IE_NS = (document.body.clientHeight) ? 1 : 0;
var SNOW_browser_MOZ = (self.innerWidth) ? 1 : 0;
var SNOW_browser_IE7 = (document.documentElement.clientHeight) ? 1 : 0;

var SNOW_Time;
var SNOW_dx, SNOW_xp, SNOW_yp;
var SNOW_am, SNOW_stx, SNOW_sty;
var i, SNOW_Browser_Width, SNOW_Browser_Height;

if (SNOW_browser_IE_NS)
{
SNOW_Browser_Width = document.body.clientWidth;
SNOW_Browser_Height = document.body.clientHeight;
}
else if (SNOW_browser_MOZ)
{
SNOW_Browser_Width = self.innerWidth - 20;
SNOW_Browser_Height = self.innerHeight;
}
else if (SNOW_browser_IE7)
{
SNOW_Browser_Width = document.documentElement.clientWidth;
SNOW_Browser_Height = document.documentElement.clientHeight;
}

SNOW_dx = new Array();
SNOW_xp = new Array();
SNOW_yp = new Array();
SNOW_am = new Array();
SNOW_stx = new Array();
SNOW_sty = new Array();

for (i = 0; i < SNOW_no; ++ i)
{
SNOW_dx[i] = 0;
SNOW_xp[i] = Math.random()*(SNOW_Browser_Width-50);
SNOW_yp[i] = Math.random()*SNOW_Browser_Height;
SNOW_am[i] = Math.random()*20;
SNOW_stx[i] = 0.02 + Math.random()/10;
SNOW_sty[i] = 0.7 + Math.random();
if (i == 0) document.write("<\div id=\"SNOW_flake"+ i +"\" style=\"position: absolute; z-index: "+ i +"; visibility: visible; top: 15px; left: 15px;\"><a href=\"http://www.peters1.dk\" target=\"_blank\"><\img src=\""+SNOW_Picture+"\" border=\"0\"></a><\/div>");
else document.write("<\div id=\"SNOW_flake"+ i +"\" style=\"position: absolute; z-index: "+ i +"; visibility: visible; top: 15px; left: 15px;\"><\img src=\""+SNOW_Picture+"\" border=\"0\"><\/div>");
}

function SNOW_Weather()
{

for (i = 0; i < SNOW_no; ++ i)
{
SNOW_yp[i] += SNOW_sty[i];

if (SNOW_yp[i] > SNOW_Browser_Height-50)
{
SNOW_xp[i] = Math.random()*(SNOW_Browser_Width-SNOW_am[i]-30);
SNOW_yp[i] = 0;
SNOW_stx[i] = 0.02 + Math.random()/10;
SNOW_sty[i] = 0.7 + Math.random();
}

SNOW_dx[i] += SNOW_stx[i];

document.getElementById("SNOW_flake"+i).style.top=SNOW_yp[i]+"px";
document.getElementById("SNOW_flake"+i).style.left=SNOW_xp[i] + SNOW_am[i]*Math.sin(SNOW_dx[i])+"px";
}

SNOW_Time = setTimeout("SNOW_Weather()", 10);

}

SNOW_Weather();


Wklej to do notatnika, uzupełnij i zapisz jako matrix.js , i wrzuć na ftp.

CYTAT
<script type="text/javascript" src="link do pliku matrix.js"></script>

Później wklej ten kod gdzie będziesz chciał.


Czy istnieje możliwość zrobienia na stronie 2 przycisków? Włączającego i wyłączającego ten skrypt?


RE: [JS]Przycisk wyłączający skrypt - Kartofelek - 15-12-2010

Hmmm. Pewnie tak ;]

<input type="button" id="wlacz" value="+" />
<input type="button" id="wylacz" value="-" />
<script type="text/javascript">
document.getElementById('wlacz').onclick = SNOW_Weather;
documen.getElementById('wylacz').onclick = function() {clearTimeout(SNOW_Time); lecimy = false;}
</script>

Dobrze tez przerobic linijkę w twoim skrypcie z

SNOW_Time = setTimeout("SNOW_Weather()", 10);

na

if (lecimy) SNOW_Time = setTimeout("SNOW_Weather()", 10);

i dodac deklaracje tej zmiennej na poczatku twojego skryptu

var lecimy = true; // <---- DEKLARACJA
var SNOW_Picture = "link do spadającego elementu"
var SNOW_no = 15;


RE: [JS]Przycisk wyłączający skrypt - Ratatuj1995 - 15-12-2010

wyszło ci 1/3 Big Grin

naciśnięcie plusa powoduje szybszy ruch elementów natomiast minusa nic, może coś źle wkleiłem

ale i tak dzieki, jesli wiesz co mogłem zrobić źle proszę o podpowiedź


RE: [JS]Przycisk wyłączający skrypt - Kartofelek - 16-12-2010

Noc jest, więc głupoty gadam. Tamtego posta nie było.

Zrób dwa guziki jak pisałem (mimo że nie pisałem), po czym podepnij im poniższy skrypcik:

document.getElementById('wlacz').onclick = function() {SNOW_Weather();}
document.getElementById('wylacz').onclick = function() {clearTimeout(SNOW_Time);}


RE: [JS]Przycisk wyłączający skrypt - Ratatuj1995 - 16-12-2010

Big Grin że tak powiem idzie ci coraz lepiej, wszystko działa tyle że minus zatrzymuje elementy ale one nie znikają, może tego się nie da zrobić?
ale musze przyznać niezły jesteś i tak


RE: [JS]Przycisk wyłączający skrypt - Kartofelek - 16-12-2010

Dobra. Przerobiłem ci pobieżnie ten skrypt, stosując nieco nowocześniejsze metody. Całości nie przerabiałem, bo jestem śmierdzący leń.

Całość kodu wraz z html zamieszczam poniżej. Skopiuj, wklej, odpal. I przeanalizuj czemu zrobiłem to tak, a nie inaczej. I przy okazji obczaj sobie tą lekcję:

http://doman.art.pl/kursjs/kurs/hierarchia/hierarchia_tworzenie_i_usuwanie.html

Kod:
<html>
<body>
<input type="button" id="wlacz" value="+" />
<input type="button" id="wylacz" value="-" />
</body>
<script>
////////////////////////////////////////////////////////////////
// Javascript made by Rasmus - http://www.peters1.dk //
////////////////////////////////////////////////////////////////

var SNOW_Picture = "gwiazdka3d.gif"
var SNOW_no = 15;

var SNOW_browser_IE_NS = (document.body.clientHeight) ? 1 : 0;
var SNOW_browser_MOZ = (self.innerWidth) ? 1 : 0;
var SNOW_browser_IE7 = (document.documentElement.clientHeight) ? 1 : 0;

var SNOW_Time;
var SNOW_dx, SNOW_xp, SNOW_yp;
var SNOW_am, SNOW_stx, SNOW_sty;
var i, SNOW_Browser_Width, SNOW_Browser_Height;

if (SNOW_browser_IE_NS)
{
SNOW_Browser_Width = document.body.clientWidth;
SNOW_Browser_Height = document.body.clientHeight;
}
else if (SNOW_browser_MOZ)
{
SNOW_Browser_Width = self.innerWidth - 20;
SNOW_Browser_Height = self.innerHeight;
}
else if (SNOW_browser_IE7)
{
SNOW_Browser_Width = document.documentElement.clientWidth;
SNOW_Browser_Height = document.documentElement.clientHeight;
}

////////////////////////////////////////////////////////////////
///______________________________ OD TAD ZMIENILEM ____________________
////////////////////////////////////////////////////////////////

var    SNOW_dx = new Array();
var    SNOW_xp = new Array();
var    SNOW_yp = new Array();
var    SNOW_am = new Array();
var    SNOW_stx = new Array();
var    SNOW_sty = new Array();

function snow_create() {
    SNOW_dx = new Array();
    SNOW_xp = new Array();
    SNOW_yp = new Array();
    SNOW_am = new Array();
    SNOW_stx = new Array();
    SNOW_sty = new Array();

    for (i = 0; i < SNOW_no; ++ i)
    {
    SNOW_dx[i] = 0;
    SNOW_xp[i] = Math.random()*(SNOW_Browser_Width-50);
    SNOW_yp[i] = Math.random()*SNOW_Browser_Height;
    SNOW_am[i] = Math.random()*20;
    SNOW_stx[i] = 0.02 + Math.random()/10;
    SNOW_sty[i] = 0.7 + Math.random();
    var platek = document.createElement('div');
        platek.id = 'SNOW_flake' + i;
        platek.style.position = 'absolute';
        platek.style.zIndex = i;
        platek.style.top = '15px';
        platek.style.left = '15px';
    var obrazek = document.createElement('img');
        obrazek.src = SNOW_Picture;
        
    platek.appendChild(obrazek);
    document.getElementsByTagName('body')[0].appendChild(platek);
    }
    SNOW_Weather();
}

function snow_delete() {
    clearTimeout(SNOW_Time);
    
    SNOW_dx = new Array();
    SNOW_xp = new Array();
    SNOW_yp = new Array();
    SNOW_am = new Array();
    SNOW_stx = new Array();
    SNOW_sty = new Array();

    for (i = 0; i < SNOW_no; ++ i)
    {
        var platek = document.getElementById("SNOW_flake"+ i);
        console.log(platek);
        platek.parentNode.removeChild(platek);
    }
}


function SNOW_Weather()
{

    for (i = 0; i < SNOW_no; ++ i)
    {
    SNOW_yp[i] += SNOW_sty[i];

    if (SNOW_yp[i] > SNOW_Browser_Height-50)
    {
    SNOW_xp[i] = Math.random()*(SNOW_Browser_Width-SNOW_am[i]-30);
    SNOW_yp[i] = 0;
    SNOW_stx[i] = 0.02 + Math.random()/10;
    SNOW_sty[i] = 0.7 + Math.random();
    }

    SNOW_dx[i] += SNOW_stx[i];

    document.getElementById("SNOW_flake"+i).style.top=SNOW_yp[i]+"px";
    document.getElementById("SNOW_flake"+i).style.left=SNOW_xp[i] + SNOW_am[i]*Math.sin(SNOW_dx[i])+"px";
    }

    SNOW_Time = setTimeout("SNOW_Weather()", 10);

}

snow_create();

document.getElementById('wlacz').onclick = function() {
    snow_create()
}
document.getElementById('wylacz').onclick = function() {
    snow_delete();
}
</script>
</html>



RE: [JS]Przycisk wyłączający skrypt - Ratatuj1995 - 16-12-2010

nie wiem czy taki głupi jestem ale nadal nie znikają tylko się zatrzymują


RE: [JS]Przycisk wyłączający skrypt - Kartofelek - 16-12-2010

eh. chyba jestem pijany. Usuń z tego skryptu co ci dałem linijkę console.log(.....);


RE: [JS]Przycisk wyłączający skrypt - Ratatuj1995 - 17-12-2010

no, dzięki stary, jesteś dla mnie prawie jak bóg,
jestem ci bardzo wdzięczny


RE: [JS]Przycisk wyłączający skrypt - Kartofelek - 17-12-2010

Możesz mi mówić Spagetti ;]