Tämä on mainospaikka (näillä pidetään sivusto pystyssä)
HTML
- Viestiketjun aloittaja Knight
- Aloituspäivämäärä
Pakko kaivaa taas vanha threadi haudastaan.
Sivut ovat edistyneet aika paljon, ja nyt haluaisin saada tehtyä seuraavaa:
Yhdessä kansiossa on x-määrä kuvia. Haluan yhden näistä kuvista tiettyyn paikkaan sivuille. Mutta haluaisin jonkin arpomakoneen, jolla siihen tulisi kuva aina randomilla niin, että aina kun sivun lataa, niin se repäisee sieltä kansiosta aina jonkun sattumanvaraisen kuvan.
En löytänyt W3Schoolsista tai HTML Helpistä apua, luultavasti tätä ei saa edes millään HTML:llä tehtyä. Mutta auttakaa jotenkin, vaikka linkillä.
Sivut ovat edistyneet aika paljon, ja nyt haluaisin saada tehtyä seuraavaa:
Yhdessä kansiossa on x-määrä kuvia. Haluan yhden näistä kuvista tiettyyn paikkaan sivuille. Mutta haluaisin jonkin arpomakoneen, jolla siihen tulisi kuva aina randomilla niin, että aina kun sivun lataa, niin se repäisee sieltä kansiosta aina jonkun sattumanvaraisen kuvan.
En löytänyt W3Schoolsista tai HTML Helpistä apua, luultavasti tätä ei saa edes millään HTML:llä tehtyä. Mutta auttakaa jotenkin, vaikka linkillä.
Tämän parempaan en pysty, mutta kyllä se aika hyvin näyttäisi toimivan. Eli tässä koodi:
Koodi:
<script name="javascript">
<!--
var pic='3';
var decide = Math.round(Math.random() * 2);
if( decide == 1 ) {
pic = '1';
}
if( decide == 2 ) {
pic = '2';
}
document.write("<img src='photo"+pic+".jpg'>");
// -->
</script>Oletuksena on nyt, että kuvia on kolme ja kaikki sijaitsevat samassa juuressa kuin sivu, johon tämä koodinpätkä on laitettu. Kuvien nimet tulee olla photo1.jpg, photo2.jpg ja photo3.jpg.
Jos kuvia on n-määrä (viimeinen kuva on photon.jpg), koodi on seuraavanlainen:
Koodi:
<script name="javascript">
<!--
var pic='n';
var decide = Math.round(Math.random() * n-1);
if( decide == n-(n-1) ) {
pic = 'n-(n-1)';
...
}
if( decide == n-5 ) {
pic = 'n-5';
}
if( decide == n-4 ) {
pic = 'n-4';
}
if( decide == n-3 ) {
pic = 'n-3';
}
if( decide == n-2 ) {
pic = 'n-2';
}
if( decide == n-1 ) {
pic = 'n-1';
}
document.write("<img src='photo"+pic+".jpg'>");
// -->
</script>Sekavaa...
Kiitos paljon. Mutta entä jos kansio on eri (/Nikit) ja kuvia 60, niin miten sitten toimitaan? En oikein JavaScriptiä ymmärrä.
EDIT: Ja kuvassa ei saa olla rajoja.
Kokeilin tuota ensimmäistä koodia tavallisen HTML:n kanssa, ja kaikki muut kuvat menivät sekaisin. Yksikseen tuo koodi toimii loistavasti (ja paksuja mustia ääriviivaja ei ole. Kuva sijoittuu muuten taulukon solun sisään.
Kiitos paljon. Mutta entä jos kansio on eri (/Nikit) ja kuvia 60, niin miten sitten toimitaan? En oikein JavaScriptiä ymmärrä.
EDIT: Ja kuvassa ei saa olla rajoja.
Kokeilin tuota ensimmäistä koodia tavallisen HTML:n kanssa, ja kaikki muut kuvat menivät sekaisin. Yksikseen tuo koodi toimii loistavasti (ja paksuja mustia ääriviivaja ei ole. Kuva sijoittuu muuten taulukon solun sisään.
Viimeksi muokannut moderaattori:
Jos kuvia on 60, kannattaa jo kyllä miettiä muunlaisia ratkaisuja. Kyllähän se tuollakin tavalla saisi tehtyä, mutta varmasti siihen löytyisi joku elegantimpikin ratkaisu.
Kansio ei ole ongelma. <img src='photo"+pic+".jpg'>:n tilalle tulisi vain <img src='/nikit/photo"+pic+".jpg'>. Tuon koodin voi myös laittaa solun sisään, joten siinäkään ei pitäisi olla mitään ongelmaa.
Eihän ne mitään sekaisin mennyt, olin vain idiootti. Katsotaan nyt jos saan skulaamaan. Kiitos.
EDIT: Sain toimimaan! En oikein ensin tajunnut tuota koodia, mutta sitten selkisi. Nyt toimii juuri niin kuin halusinkin. Tuo on tällä hetkellä varmaankin sivujeni kehittynein koodinpätkä.
EDIT: Sain toimimaan! En oikein ensin tajunnut tuota koodia, mutta sitten selkisi. Nyt toimii juuri niin kuin halusinkin. Tuo on tällä hetkellä varmaankin sivujeni kehittynein koodinpätkä.
Viimeksi muokannut moderaattori:
Varmaan taas tarvittaisiin Javaa:
Pitäisi saada valikon kuvat vaihtumaan sitä mukaa, kun niiden päälle änkeää hiiren. Yritin ottaa mallia Elasto Manian sivuilta, mutta ei onnannut.
Pitäisi saada valikon kuvat vaihtumaan sitä mukaa, kun niiden päälle änkeää hiiren. Yritin ottaa mallia Elasto Manian sivuilta, mutta ei onnannut.
U
uusi käyttäjä
Guest
Turhaa kikkailua, keskity ennemmin sisältöön.
Ulkoasuun kannattaa panostaa siinä missä sisältöönkin. Yleensä kotisivut ei ole mitään kirjoja, joten ei sen ulkoasunkaan pitäisi olla sen mukainen.
Tää eka aukasee sivun pop-uppiin.
Tässä sulle koodipätkää. Tää eka alkuun:
<script language="JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
Tässä ite setti BODYN Jälkeen:
<a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('kuvannimi','','kuva1.gif',1)" onClick="MM_openBrWindow('linkki.html','linkki','toolbar=no,location=no,left=15,top=30,status=no,menubar=no,scrollbars=no,resizable=no,width=800,height=400')"><img name="kuvannimi" src="kuva.gif" border="0" width="99" height="26" alt="" hspace="0" vspace="0"></a>
Tässä toinen, ehket sulle paremmin sopivavaihtoehto joka ei aukase pop-uppiin. Jos pistät noita monta putkeen niin muista korvata tossa esimerkissä noi 02:set eriluvuiks per linkki.
<script language="JavaScript">SecondImage02='kuva1.gif';</script><a href="linkki.html" target="se freimi mihin aukasee" onMouseOver="{OrigImage02=img02.src; img02.src=SecondImage02} " onMouseOut="img02.src=OrigImage02"><img alt="" name="img02" border="0" src="kuva.gif" width="183" height="11" onLoad="TempImage02=new Image(0,0); TempImage02.src=SecondImage02"></a>
Toivottavasti saat jotain selvää.
Tää eka aukasee sivun pop-uppiin.
Tässä sulle koodipätkää. Tää eka alkuun:
<script language="JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
Tässä ite setti BODYN Jälkeen:
<a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('kuvannimi','','kuva1.gif',1)" onClick="MM_openBrWindow('linkki.html','linkki','toolbar=no,location=no,left=15,top=30,status=no,menubar=no,scrollbars=no,resizable=no,width=800,height=400')"><img name="kuvannimi" src="kuva.gif" border="0" width="99" height="26" alt="" hspace="0" vspace="0"></a>
Tässä toinen, ehket sulle paremmin sopivavaihtoehto joka ei aukase pop-uppiin. Jos pistät noita monta putkeen niin muista korvata tossa esimerkissä noi 02:set eriluvuiks per linkki.
<script language="JavaScript">SecondImage02='kuva1.gif';</script><a href="linkki.html" target="se freimi mihin aukasee" onMouseOver="{OrigImage02=img02.src; img02.src=SecondImage02} " onMouseOut="img02.src=OrigImage02"><img alt="" name="img02" border="0" src="kuva.gif" width="183" height="11" onLoad="TempImage02=new Image(0,0); TempImage02.src=SecondImage02"></a>
Toivottavasti saat jotain selvää.
No tässä on hiukan samantyyppinen sivusto, jossa on panostettu ulkoasuunkin http://www.newstoday.com/ .
Sisältö on vain yksi osa sivustoa, aivan kuten auton moottori, ulkoasu taas kori, jarrut, ohjaustehostimet toimii käyttöliittymänä.
Tuo esimerkki sivusi olisi ollut täten verrannollinen Ladaan.. Kestävä moottori mikä käynnistyy 50 asteen pakkasessakin, mutta p*rkeleen ruma ja olematon käyttöliittymä.
Näistä kaikki ovat loppujen lopuksi yhtä tärkeitä, joillekin tärkein on auton moottori, mutta ei korin merkitystäkään voi väheksyä, väriä yms. Joillekin korikin saattaa olla tärkein tekijä auton hankinnassa. Puhumattakaan alustasta, vaihteistosta, penkeistä, jalkatilasta -> käyttöliittymä.
Joskus 7 vuotta sitten sisällön hehkutukset oli in ja siihen oli yksinkertainen syy. Html oli siihen aikaan todella rumaa, ja erittäin harvat sitä osasi edes käyttää. Näyttöresoluutiot luokkaa 640*480, joten sekin oli otettava huomioon.
Tässä katottavaks esim linkkisivusto joka on erittäin kaunis, mahtavasti suunniteltu ja erittäin toimiva. Ennen kaikkea miellyttävä lukea. http://www.bluevertigo.com.ar/
Sisältö on vain yksi osa sivustoa, aivan kuten auton moottori, ulkoasu taas kori, jarrut, ohjaustehostimet toimii käyttöliittymänä.
Tuo esimerkki sivusi olisi ollut täten verrannollinen Ladaan.. Kestävä moottori mikä käynnistyy 50 asteen pakkasessakin, mutta p*rkeleen ruma ja olematon käyttöliittymä.
Näistä kaikki ovat loppujen lopuksi yhtä tärkeitä, joillekin tärkein on auton moottori, mutta ei korin merkitystäkään voi väheksyä, väriä yms. Joillekin korikin saattaa olla tärkein tekijä auton hankinnassa. Puhumattakaan alustasta, vaihteistosta, penkeistä, jalkatilasta -> käyttöliittymä.
Joskus 7 vuotta sitten sisällön hehkutukset oli in ja siihen oli yksinkertainen syy. Html oli siihen aikaan todella rumaa, ja erittäin harvat sitä osasi edes käyttää. Näyttöresoluutiot luokkaa 640*480, joten sekin oli otettava huomioon.
Tässä katottavaks esim linkkisivusto joka on erittäin kaunis, mahtavasti suunniteltu ja erittäin toimiva. Ennen kaikkea miellyttävä lukea. http://www.bluevertigo.com.ar/
U
uusi käyttäjä
Guest
Otsikoita klikkailemalla pääsee lukemaan kyseisen "pakinan". Mikä voi olla helpompaa?
Fatal Error: No DOCTYPE specified!
I could not parse this document, because it does not include a DOCTYPE Declaration. A DOCTYPE Declaration is mandatory for most current markup languages and without such a declaration it is impossible to validate this document.
You should place a DOCTYPE declaration as the very first thing in your HTML document. For example, for a typical XHTML 1.0 document:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Title</title>
</head>
<body>
<!-- ... body of document ... -->
</body>
</html>
For XML documents, you may also wish to include an "XML Declaration" even before the DOCTYPE Declaration, but this is not well supported in older browsers. More information about this can be found in the XHTML 1.0 Recommendation.
The W3C QA Activity maintains a List of Valid Doctypes that you can choose from, and the WDG maintains a document on "Choosing a DOCTYPE".
I could not parse this document, because it does not include a DOCTYPE Declaration. A DOCTYPE Declaration is mandatory for most current markup languages and without such a declaration it is impossible to validate this document.
You should place a DOCTYPE declaration as the very first thing in your HTML document. For example, for a typical XHTML 1.0 document:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Title</title>
</head>
<body>
<!-- ... body of document ... -->
</body>
</html>
For XML documents, you may also wish to include an "XML Declaration" even before the DOCTYPE Declaration, but this is not well supported in older browsers. More information about this can be found in the XHTML 1.0 Recommendation.
The W3C QA Activity maintains a List of Valid Doctypes that you can choose from, and the WDG maintains a document on "Choosing a DOCTYPE".