Autor Zpráva
mackopu
Profil
#1 · Zasláno: 27. 10. 2005, 19:33:56
Odpovědět Citovat
Je to sice pouťovka, ale potřebuji na prezentační stránku dostat plynulou změnu barvy pozadí z bílé na oranžovou a zpět (a tak stále dokola) hned po načtení stránky bez vazby na jinou událost (prostě body onload). No a největší pecka by byla, kdyby se text v tutéž chvíli měnil inverzně k tomu. Mohla by vzniknout zajímavá prolínačka.
Vážně jsem hledal na Googlu, ale nic z toho se nehodí :-\
Díky za každý námět.
Mistr
Profil
#2 · Zasláno: 27. 10. 2005, 20:11:23
Odpovědět Citovat 
<HTML>

  <HEAD>

    <TITLE> Efektní zobrazení </TITLE>

    <SCRIPT Language="JavaScript">

      <!--

      // Funkce, která postupně mění barvu pozadí

      function Fade(){

        // Forcyklem se mění barva pozadí z černé (všechny

        // složky RGB mají hodnotu 0 na bílou (hodnoty 255)

        for (var i=0; i<255; i+=1){

          document.bgColor=i + 256*i + 256*256*i;

        }

      }

      // -->

    </SCRIPT>

  </HEAD>



  <BODY BgColor="black" OnLoad="Fade()">

    <CENTER><FONT Color="white">

    Stránka se načítá...

    </FONT></CENTER>

    <FONT Color="black">

    Bla bla bla...

    </FONT>

  </BODY>

</HTML>


Je to návod z knížky JavaScript: Hotová řešení od Petra Václavka. Ten kód si zkopíruj a do HTM stránky a spusť si to. Uvidíš, zda je to ono, co jsi potřeboval.
Radek Hrabůvka
Profil
#3 · Zasláno: 27. 10. 2005, 20:18:05
Odpovědět Citovat
Přiznávám, že jsem to teď nečet, asi bude třeba dost úprav:
Pulzující barva odkazů
Měnící se barvy scrollbarů
Nádherné pouťovky pro hambaté stránky.
Radek Hrabůvka
Profil
#4 · Zasláno: 27. 10. 2005, 20:38:07
Odpovědět Citovat
Mistr Gůglím, že temhle skript je v asijských zemích velmi oblíben
http://www.google.com/search?q=document.bgColor%3Di+%2B+256*i+%2B+256* 256*i&hl=cs&lr=&as_qdr=all&start=50&sa=N
mackopu
Profil
#5 · Zasláno: 27. 10. 2005, 20:55:54 · Upravil/a: mackopu
Odpovědět Citovat
Zatím se mi zdá být nejpoužitelnější to od Mistra
Fajn - upravil jsem to na: 
    <SCRIPT Language="JavaScript">

      <!--

      // Funkce, která postupně mění barvu pozadí

      function Fade(){

        // Forcyklem se mění barva pozadí z černé (všechny

        // složky RGB mají hodnotu 0 na bílou (hodnoty 255)

        for (var i=0; i<255; i+=1){

          document.bgColor=i + 256*i + 256*256*i;

        }

        for (var i=255; i>0; i-=1){

          document.bgColor=i + 256*i + 256*256*i;

        }

      }

      // -->

    </SCRIPT>

Teď už jen aby to běhalo pořád dokola a místo černé aby byla oranžová.
A to je to co neumím, protože jsem spíš PHPmaniak ;-)

Jinak díky všem, vydržte ještě chvilku než to vyřešíme, může se nám to všem hodit...
Mistr
Profil
#6 · Zasláno: 27. 10. 2005, 21:01:37
Odpovědět Citovat
mackopu
Já jsem jenom překopíroval skript z knížky, nic víc jsem s tím nedělal, takže díky, že o něj takhle pečuješ.


místo černé aby byla oranžová
Když si zjistíš ty RGB kódy barev, mezi nimiž to má kmitat, tak to snad nějak půjde, ne? V této části to snad musí být stejné jako v PHP, pokud se nepletu.
Mistr
Profil
#7 · Zasláno: 27. 10. 2005, 21:03:01
Odpovědět Citovat
Radek Hrabůvka
v asijských zemích velmi oblíben
A proč myslíš, že se Japonsku říká Země vycházejícího slunce? :-))
mackopu
Profil
#8 · Zasláno: 27. 10. 2005, 21:09:25
Odpovědět Citovat
RGB té oranžové je 246,128,0 - ale nevím, jak to do toho skriptu implementovat, nehledě na to, že potřebuji opakování.
Mistr
Profil
#9 · Zasláno: 27. 10. 2005, 21:39:56
Odpovědět Citovat
Chceš to z černé na oranžovou a zase zpět? Napadá mě použítí dvou cyklů. Ve stávajícím případě je jen jeden s "i", teď by se musely použít dva, pro červenou a zelenou barvu jeden (modrá je stále nulová) a každý by běžel do jiného čísla. Jenom bude problém, že červená běží od nuly až do 246, kdežto zelená jen do 128. Leda snad, že by se upravil krok, po které by to mělo běžet.
Mistr
Profil
#10 · Zasláno: 27. 10. 2005, 21:52:29
Odpovědět Citovat
A to opakování? Snad nějakou podmínkou... Ale je to dost takové "těžkopádné" - chybí tomu elegance zkušeného programátora. :-) No, ale tím se teď trápit nemusíme, ne?
PerToon
Profil
#11 · Zasláno: 27. 10. 2005, 21:57:04
Odpovědět Citovat
Z http://www.javascriptsource.com

<!-- THREE STEPS TO INSTALL BACKGROUND FADER:

1. Put the specified code into the HEAD of your HTML document
2. Add the onLoad event handler to the BODY tag
3. Paste the last code into the BODY of your HTML document -->

<!-- STEP ONE: Copy this code into the HEAD of your HTML document -->

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Hide from old browsers
var Color= new Array(9);
Color[1] = "ff";
Color[2] = "ee";
Color[3] = "dd";
Color[4] = "cc";
Color[5] = "bb";
Color[6] = "aa";
Color[7] = "99";
Color[8] = "88";
Color[9] = "77";
Color[10] = "66";
Color[11] = "55";
Color[12] = "44";
Color[13] = "33";
Color[14] = "22";
Color[15] = "11";
Color[16] = "00";
/* Do not display text on a fading background. Instead, let it
fade in and out once or twice, then load a new page. */
function fadeIn(where) {
if (where >= 1) {
document.bgColor="#" + Color[where] +"0000";
where -= 1;
setTimeout("fadeIn("+where+")", 15);
} else {
setTimeout('fadeOut(1)', 15);
}
}
function fadeOut(where) {
if (where <=16) {
document.bgColor="#" + Color[where] +"0000";
where += 1;
setTimeout("fadeOut("+where+")", 15)
} else {
setTimeout("fadeIn(16)", 15);
// window.location.href="http://www.netscape.com/";
}
}
// Unhide -->
</SCRIPT>

<!-- STEP TWO: Add the onLoad event handler to the BODY tag -->

<BODY onLoad="fadeIn(16)">

<!-- STEP THREE: Copy this code into the BODY of your HTML document -->

<BODY>

<CENTER>
<SCRIPT LANGUAGE="Javascript">
<FORM>
<INPUT TYPE="button" VALUE=" BACK " onClick="history.go(-1)">
<INPUT TYPE="button" VALUE="FORWARD" onCLick="history.go(1)">
</FORM>
</SCRIPT>
</CENTER>

<p><center>
<font face="arial, helvetica" size="-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

<!-- Script Size: 1.81 KB -->
mackopu
Profil
#12 · Zasláno: 27. 10. 2005, 22:00:01
Odpovědět Citovat
Tedy já se tím dost trápím, jinak bych už ležel v pelechu a těšil se na svátek :-)
Potřebuji to z bílé na oranžovou a zpět.
A stále dokola, dokud mě to nepřestane bavit a nezavřu browser.
Nápověda mi asi nepomůže, spíš by píchnul konkrétní zdroják a nemusíme řešit podporu prohlížečem, protože o tom to není (ale to je na tomto fóru samozřejmost, že - debaty o javascriptu by neměli končit úvahami o jeho opodstaněnosti a použitelnosti; tedy ne že by to tu někdo dělal %))
PerToon
Profil
#13 · Zasláno: 27. 10. 2005, 22:07:28
Odpovědět Citovat
Tohleto document.bgColor="#"+Color[where]+"0000"; změň na document.bgColor="#"+Color[where];

A do těch Color[číslo]="něco"; zapiš místo něco postupný šestnáctkový kódy těch barev.
Bílá je ffffff a oranžová bude něco jako ffaa00. Takže jde o to udělat 16 postupných fází mezi ffffff a ffaa00, což je trochu pracný, ale dá se to udělat. Pokud budeš chtít těch kroků mezitím míň, bude se ten kód muset víc změnit.
Radek Hrabůvka
Profil
#14 · Zasláno: 27. 10. 2005, 22:49:18
Odpovědět Citovat
#F68000
#F78911
#F89122
#F89A33
#F9A244
#F9AB55
#FAB366
#FBBC77
#FBC488
#FCCC99
#FCD5AA
#FDDDBB
#FEE6CC
#FEEEDD
#FFF7EE
#FFFFFF
mackopu
Profil
#15 · Zasláno: 27. 10. 2005, 22:54:36
Odpovědět Citovat
Dokážete z toho někdo dát dohromady ucelený script? Já bohužel ne.
Díky za námahu a ochotu - vážně tohle neovládám.
PerToon
Profil
#16 · Zasláno: 27. 10. 2005, 23:07:29
Odpovědět Citovat
<head>
<SCRIPT LANGUAGE="JavaScript">
var Color= new Array(9);
Color[1] = "f68000";
Color[2] = "f78911";
Color[3] = "f89122";
Color[4] = "f89a33";
Color[5] = "f9a244";
Color[6] = "f9ab55";
Color[7] = "fab366";
Color[8] = "fbbc77";
Color[9] = "fbc488";
Color[10] = "fccc99";
Color[11] = "fcd5aa";
Color[12] = "fdddbb";
Color[13] = "fee6cc";
Color[14] = "feeedd";
Color[15] = "fff7ee";
Color[16] = "ffffff";
function fadeIn(where) {
if (where >= 1) {
document.bgColor="#" + Color[where];
where -= 1;
setTimeout("fadeIn("+where+")", 15);
} else {
setTimeout('fadeOut(1)', 15);
}
}
function fadeOut(where) {
if (where <=16) {
document.bgColor="#" + Color[where];
where += 1;
setTimeout("fadeOut("+where+")", 15)
} else {
setTimeout("fadeIn(16)", 15);
}
}
</SCRIPT>
</head>
<body onLoad="fadeIn(16)">
mackopu
Profil
#17 · Zasláno: 27. 10. 2005, 23:40:47
Odpovědět Citovat
PerToon
To je přesně ono - díky moc a odpusťe PHPčkáři, že sem strčil čenich ;-)
Snad se budu moci revanšovat.
PerToon
Profil
#18 · Zasláno: 27. 10. 2005, 23:42:12
Odpovědět Citovat
Nemáš zač, a až já začnu s php, budu mnohem otravnější, takže se asi budeš moct revanšovat! :-)
Radek Hrabůvka
Profil
#19 · Zasláno: 27. 10. 2005, 23:45:26
Odpovědět Citovat
Je to prasárna nechutně to bliká a hnusný kód, testováno zatím jen v IE:

<script>
var poblik1 = 50;
var A1 = "#F68000"
var A2 = "#F78911"
var A3 = "#F89122"
var A4 = "#F89A33"
var A5 = "#F9A244"
var A6 = "#F9AB55"
var A7 = "#FAB366"
var A8 = "#FBBC77"
var A9 = "#FBC488"
var A10 = "#FCCC99"
var A11 = "#FCD5AA"
var A12 = "#FDDDBB"
var A13 = "#FEE6CC"
var A14 = "#FEEEDD"
var A15 = "#FFF7EE"
var A16 = "#FFFFFF"

var p = 0;
function bliky()
{p++;
if (p==1) A = A1
if (p==2) A = A2
if (p==3) A = A3
if (p==4) A = A4
if (p==5) A = A5
if (p==6) A = A6
if (p==7) A = A7
if (p==8) A = A8
if (p==9) A = A9
if (p==10) A = A10
if (p==11) A = A11
if (p==12) A = A12
if (p==13) A = A13
if (p==14) A = A14
if (p==15) A = A15
if (p==16) A = A16
if (p==17) A = A15
if (p==18) A = A14
if (p==19) A = A13
if (p==20) A = A12
if (p==21) A = A11
if (p==22) A = A10
if (p==23) A = A9
if (p==24) A = A8
if (p==25) A = A7
if (p==26) A = A6
if (p==27) A = A5
if (p==28) A = A4
if (p==29) A = A3
if (p==30) A = A2

document.body.style.background = A
if (p>30) p=0;timer=setTimeout('bliky()', poblik1)}
</SCRIPT>

</head>
<body onload='bliky()'>
mackopu
Profil
#20 · Zasláno: 27. 10. 2005, 23:54:24 · Upravil/a: mackopu
Odpovědět Citovat
Radek Hrabůvka
Rovněž dobré, ale v IE 6 se mi to chová stejně jako od PerToona, jen je to pomalejší. A na IE 6 je to vázáno, protože je to cílená prezentace závislá na typu browseru (ten prostě bude právě tento).
Snad už mi k naprostému štěstí chybí jen ta inverzní změna barvy textu (tzn. pozadí oranžoví, zatímco text bělá, a opačně), ale to už je fakt moc velkej nářez...
Fred
Profil
#21 · Zasláno: 27. 10. 2005, 23:57:46
Odpovědět Citovat
Uprav si ten poslední script dole http://javascript-fx.com/navigation/index.html funguje všude.
PerToon
Profil
#22 · Zasláno: 28. 10. 2005, 00:02:19
Odpovědět Citovat
Inverzní jakožto opačný postup barev (čili z bílé do oranžové místo z oranžové do bílé) by to takový problém nebyl.
Pokud by například místo bílý měla být černá a místo oranžový nějaká modrozelená, tak by se musel napsat další seznam barev....
Radek Hrabůvka
Profil
#23 · Zasláno: 28. 10. 2005, 00:06:44
Odpovědět Citovat
mackopu Můj skript nejede v Opeře 9, ale ta je zatím TP. Script, co napsal PerToon mi nejede v ničem, nechápu, co dělám blbě, pastuji ho odtud úplně stejně, jako ten svůj. Naštěstí tenhle efekt nepotřebuji.
PerToon
Profil
#24 · Zasláno: 28. 10. 2005, 00:10:15
Odpovědět Citovat
Radku - Mě to teda fachá! Napsals volání toho skriptu do <body>?
Radek Hrabůvka
Profil
#25 · Zasláno: 28. 10. 2005, 00:49:09
Odpovědět Citovat
PerToon Však to máš na posledním řádku: <body onLoad="fadeIn(16)">
PerToon
Profil
#26 · Zasláno: 28. 10. 2005, 00:55:30
Odpovědět Citovat
Tak v tom případě by ti to mělo fachat...
mackopu
Profil
#27 · Zasláno: 28. 10. 2005, 01:01:48
Odpovědět Citovat
Chlapi, neřešte to (tedy pokud tu nevznikne svébytné subvlákno o podpoře browserů) - znovu opakuji že je to čistě účelový skript, který poběží hodinu na prezentaci pod IE 6 a já jsem spokojen. Myslím ale, že se to obecně může hodit nám všem, včetně toho, že modifikacemi by se dalo docílit zajímavých efektů.
Ovšem to s tou inverzní změnou barvy textu by si zasloužilo podrobněji rozebrat - ani ne tak teoreticky, jako spíš konkrétní ukázkou; mohu-li být tak smělý, neboť o tom to mimo jiné původně bylo.
Já jsem už teď šťastnej jako blecha, ale objednávku upozornění mám pořád, protože mě to samozřejmě pořád zajímá a chci se o JS něco přiučit, protože např. preload obrázku mě teda fakt dost nepřijde jako něco objevného - to si koneckonců mohu najít leckde. TOHLE je ale jiné kafe.
peta
Profil *
#28 · Zasláno: 28. 10. 2005, 08:31:35
Odpovědět Citovat
mackopu
www.volny.cz/peter.mlich/www.htm
- menu mizici

Radek Hrabůvka
co to je ten script? :)))))))
kdyz uz...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title>prechod</title>
<script type="text/javascript">
var aa = "F68000,F78911,F89122,F89A33,F9A244,F9AB55,FAB366,FBBC77,FBC488,FCCC99 ,FCD5AA,FDDDBB,FEE6CC,FEEEDD,FFF7EE,FFFFFF".split(",");
var p = 30;

function bliky()
{var q,a;
p++;
q=(p>30)?0:(p>15)?30-p:p;
p=(p>30)?0:p;
document.body.style.background = "#"+aa[q];
}

// --- hodiny ---
var timerID = null;
var tspeed = 100;

function hodiny()
{
clearTimeout(timerID)
bliky();
timerID=window.setTimeout("hodiny()",tspeed);
}

</script>
</head>

<body onload="hodiny()">
</body>
</html>

mackopu nevim, ve ktere opere ti to nefnguje, v 8.0 zadny problem.
peta
Profil *
#29 · Zasláno: 28. 10. 2005, 08:34:48
Odpovědět Citovat
mackopu sory, to psal Radek Hrabůvka, ze mu to nejede v opere.
Časová prodleva: 1 rok
banan
Profil *
#30 · Zasláno: 1. 2. 2007, 12:21:48
Odpovědět Citovat
nevím jak změnit pozadí pomůže mi někdo muj Email je banans@seznam.cz
Časová prodleva: 17 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0