Lielums,Ekrans

[sacejs]

Man tāda problēma...

Kad es taisiju saitu uz mana maza ekrāna viss ir ideāli...Bet skatoties uz saitu un forumu no LIELA ekrāna vsp sanāk sūdīģi ( spied , spied )

Ko darīt?Kāpēc viss tik stūlbi sanāk uz lielā ekrāna?Kā to sataisīt?

Ceru uz jūsu palīdzību

[Aleksejs]

Ko darīt?

Meklēt risinājumu šai problēmai. Sāc ar to, ka uzzīmē un izdomā, kā būtu jāizskatās tavai lapai uz liela un uz maza ekrāna.

 

Kāpēc viss tik stulbi sanāk uz lielā ekrāna?

Tu izmanto tā saukto fiksēto izkārtojumu (fixed layout). Dažādas ekrāna izšķirtspējas pilnvērtīgāk var izmantot ar plūstošo izkārtojumu (fluid layout). Taču šāda izkārtojuma izveidošana ir daudz sarežģītāka, nekā fiksētā izkārtojuma gadījumā (un pat fiksētais izkārtojums nav nebūt triviāla lieta).

 

Kā to var sataisīt?

Ar neatlaidīgu darbu un citu pieredzes apgūšanu pēc diezgan lielām pūlēm ir iespējams nonākt pie gala rezultāta. Līdz ar to sekas - neviens tavā vietā šo piņķerīgo darbu nedarīs - būs vien pašam jāmēģina saprast, kas un kā. Cik saprotu, tad izmanto kaut kādu CMSu un jau gatavu forumu - tos pārtaisīt, lai viss izskatītos ļoti labi ir grūts un nepateicīgs darbs, taču domāju, ka noteikti dažu mēnešu laikā (sakarā ar to, ka nav gluži izdzīvošanas jautājums kārtējais CS saits (~; ) Tu to varētu izveidot.

 

Neesmu izkārtojumu eksperts, ne tuvu ne, taču lūk daži resursi, kurus apskatot, varbūt radīsies kāda spoža doma - tie ir relatīvi vienkārši tādēļ, ka pamatā vēl aizvien ir tas pats fiksētais izkārtojums, tikai šajā gadījumā - tiek aprakstīti vairāki izkārtojumi katram ekrāna platumam savs:

http://www.clagnut.com/blog/1663/

http://www.trap17.com/index.php/css-javasc...out_t25661.html

http://www.alistapart.com/articles/switchymclayout

http://particletree.com/features/dynamic-r...endent-layouts/

[sacejs]

Es te paskatijos..un izlasiju pēc savām mazām zināšanām angļu valodā bet atradu te šo:

// JavaScript Document

if (screen.width < 1024) {

document.write('<link rel=stylesheet type="text/css" href="layout800.css">');

}

if (screen.width >= 1024) {

document.write('<link rel=stylesheet type="text/css" href="layout1024.css">');

}

if (screen.width >= 1280) {

document.write('<link rel=stylesheet type="text/css" href="layout1280.css">');

}

if (screen.width >= 1600) {

document.write('<link rel=stylesheet type="text/css" href="layout600.css">');

}

Kur es ar BOLD atzīmēju,tātad man tur vajag rakstīt http://manaadrese/news.php un tā katru norādīt http://outs.oo.lv/bans.php lai rādītu uz visiem ekrāniem normāli?

[Aleksejs]

Ne gluži. Tev vajag lai viss tas koda fragments tiktu izvadīts jebkuras Tavas lapas sākumā. Un paši css faili ir jāpielabo (faktiski jāuzraksta no jauna) tā lai atbilstu Tev vēlamajam izkārtojumam.

[sacejs]

Nesapratu ...kur tas layout800.css sataisīt lai tā un stāv?

Un tad sataisīt JS failu un to kodu ierakstīt tur un tad katrā failā norādīt šādi?:

<script type="text/javascript" src="variable.js"></script>

Vai taisīt layout800.css failu un tur visu taisīt..

[Aleksejs]

Ko domāji ar:"kur tas ... sataisīt, lai tā un stāv?"? Izsakies skaidrāk!

[sacejs]

Nu klausies,tātad man 2 varianti..

1)Tātad man vajag sataisīt layout100.css failu un tur rakstīt attiecīgos izmērus?

document.write('<link rel=stylesheet type="text/css" href="layout800.css">');

2)vai man jātaisa variable.js failu un tur jāraksta :

// JavaScript Document

if (screen.width < 1024) {

document.write('<link rel=stylesheet type="text/css" href="layout800.css">');

}

if (screen.width >= 1024) {

document.write('<link rel=stylesheet type="text/css" href="layout1024.css">');

}

if (screen.width >= 1280) {

document.write('<link rel=stylesheet type="text/css" href="layout1280.css">');

}

if (screen.width >= 1600) {

document.write('<link rel=stylesheet type="text/css" href="layout600.css">');

}

un tad man katrā failā kur gribu normālu izmēru tad vaajag norādīt šādi:?

<script type="text/javascript" src="variable.js"></script>

[Aleksejs]

2. variants. Jā, katrā failā, kurā gribi normālu izmēru.

[sacejs]

Aleksej bet kāpēc kad es sataisiju variable.js nekā neizmainijās??

Sataisiju variable.js tur rakstu:

// JavaScript Document

if (screen.width < 1024) {

document.write('<link rel=stylesheet type="text/css" href="layout800.css">');

}

if (screen.width >= 1024) {

document.write('<link rel=stylesheet type="text/css" href="layout1024.css">');

}

if (screen.width >= 1280) {

document.write('<link rel=stylesheet type="text/css" href="layout1280.css">');

}

if (screen.width >= 1600) {

document.write('<link rel=stylesheet type="text/css" href="layout600.css">');

}

Tad iegāju tur news.php un citur ierakstiju šo:

<script type="text/javascript" src="variable.js"></script>

un nekā neizmainijās...kas par..?

[Aleksejs]

Nu un Tev ir šādi faili izveidoti, kuros aprakstīts CSS:

layout600.css

layout800.css

layout1024.css

layout1280.css

?

Ja ir, tad vai ir ielikti pareizā vietā, ka JS tos var atrast?

[sacejs]

Tad vajag izveidot layout.css failus un tur iekšā rakstīt kodus kas atbilst atbilstošam ekrānam?

P.S tas že šausmas...ja tik vajag rakstīt..

[Aleksejs]

Aha! Dzīve ir ciešanu pilna! ;) Un nav rožu lauks!

[sacejs]

A kā man izdarīt lai es varētu testēt?Nu ja man mazs ekrāns un es taisīšu .css failu uz liela ekrāna tad kā lai man zināt kā viss būss?

[Aleksejs]

Nu, viens variants ir izstiept logu (nevis maksimizēt, bet izstiept to tik lielu, lai tas būtu attiecīgi tik liels, cik vajag.

Atver nemaksimizētā logā lapu:

<html><head></head><body><script>window.width=1600; window.height=1200;</script></body></html>

un šī lapa (ja visu pareizi esmu uzrakstījis) Tev izstieps logu 1600x1200px lielumā. Tad nospied alt un PrintScreen un dabūsi screenshotu tam, kā izskatās tava lapa šādā izšķirtspējā.

 

Vēl variants - nopelni ar savu plaukstošo CS biznesu līdzekļus monitoram (un arī videokartei), kas atbalsta... QSXGA izšķirtspēju un tad tuvākajā laikā nenāksies lauzīt galvu kā lapa izskatās uz liela monitora (bet nāksies par to, kā izskatās uz maza). :)

[superKrona]

FireFoxim bija adons ar kuru varēja mainīt loga izmērus uz fiksētiem loga izmēriem.

https://addons.mozilla.org/en-US/firefox/addon/5792

Edited April 22, 2009 by superKrona