Weblap megjelenítése különböző felbontáshoz probléma

Keresés
Hírlevél
 
ASPC#C++CSSDelphiFlashJavaJavaScriptPascalPerlPHPPythonuniPaaSVisual BasicVisual C++  »    
nyitotta: H.Tibcsi, idő: 2007.06.14., moderátor: moderator, megoldás elfogadva: 2007.06.14. 16:04
  Értesítés változás esetén Felvétel kedvencekhez Küldés emailben

Kategóriák:Programozási nyelvek » PHP
Web-programozás » HTML

Sorrend:
Időzóna:
Blokkméret:
Oszd meg!
hello

Mi a trükkje annak, hogy egy weblapra beszúrt kép (vagy akár a szöveg) mindig ugyanolyan arányú helyen jelenjen meg, függetlenül a felhasználóknál összevissza állított képernyőfelbontásoktól.
És még egy : ha háttérképnek megadok a jpg.-t és az alap 1024X768- ra tökéletesen illik, HOGYAN oldható meg az, hogy szélesítse vagy magasítsa a képet a különböző felbontásokhoz ?
index.html
<html>
<head>
<title>Háttér igazítása</title>
<script language="JavaScript" type="text/javascript">
function hatter(){
document.body.background='hatter.php?szeles='+screen.width+'&magas='+screen.height
}
</script>
</head>
<body onload="hatter()">
</html>



hatter.php
<?
@header("Content-type:image/jpeg");

$hatter="hatter.jpg";

$szeles=$_GET['szeles'];
if($szeles==""){$szeles=1024;}

$magas=$_GET['magas'];
if($magas==""){$magas=768;}

$gau=@getimagesize($hatter);
$img=@imagecreatefromjpeg($hatter);
$dst=@imagecreatetruecolor($szeles,$magas);
@imagecopyresampled($dst,$img,0,0,0,0,$szeles,$magas,$gau[0],$gau[1]);
@imagejpeg($dst);
?>

ez engem is érdekelt gyors megírtam előzmény
JS-el le tudod kérni a kliens felbontását:
window.availWidth és window.availHeight tárolja.
Ennek függvényében js-el oylan html kódot tudsz generálni, ami mindig az adott felbontásra illeszkedik.
Esetleg ettől függően tudsz css file-t beágyazni, pl: css800_600.css és css1024_768.css dinamikusan ágyazódnak be.

A kép nyújtását pedig szerintem nem lehet megoldani, max a kép ismétlődését. előzmény
A kép nyújtását pedig szerintem nem lehet megoldani,
Egy kis php kód és meg lehet.
(Van rá itt is sok-sok példa) előzmény
Érdemes minnél nagyobb felbontású képet beállítani mert ahogy most néztem egy 1024x768-as képet 1280x1024-ben kicsit elmosódott! előzmény
Ez tényleg ügyes kód. Ki fogom próbálni. De ugye nem csak kétféle felbontáshoz jó. A laptopomon kb 8 féle felbontás van. Ismerőseim körében is legalább öt féle különböző kép felbontást használnak....... előzmény
Ha 16:9-es az arány akkor kicsit bővíteni kell a kódot ez a hagyományos 4:3-as arányra csináltam! De kevés ember van aki 2 monitoron néz egy képernyőt felezve ha erre gondoltál. előzmény
előzmény
ja meg mégegy fontos pl ennél

<html>
<head>
<title>Háttér igazítása</title>
<script language="JavaScript" type="text/javascript">
function hatter(){
document.body.background='hatter.php?szeles='+screen.width+'&magas='+screen.height
}
</script>
</head>
<body onload="hatter()">
</html>


Tegyük fel kep.jpg a háttérképem neve. (nincs más útvonal, mert a mappa ugyanaz) Hova írjam a nevét? előzmény
<?
@header("Content-type:image/jpeg");

$hatter="hatter.jpg";

$szeles=$_GET['szeles'];
if($szeles==""){$szeles=1024;}

$magas=$_GET['magas'];
if($magas==""){$magas=768;}

$gau=@getimagesize($hatter);
$mag=floor($szeles*$gau[1]/$gau[0]);

if($mag!=$magas){
$magas=$mag;
}

$img=@imagecreatefromjpeg($hatter);
$dst=@imagecreatetruecolor($szeles,$magas);
@imagecopyresampled($dst,$img,0,0,0,0,$szeles,$magas,$gau[0],$gau[1]);
@imagejpeg($dst);
?>

Ez a kód a szélességhez igazodik és az alapján csinálja a magasságot. Tehát ha van egy 1024x768-as képed de 1360x768-ban nézed akkor az arányok megmaradnak és nem egy táglalapot kapsz. előzmény
A PHP-ben kell beállítani, az méretezi át a képet!

$hatter="kepek/hatterek/wallpaper_14149137.jpg"; előzmény
és ha nem a képernyő hanem a böngésző szélességére akarod állítani, akkor: document.body.clientWidth és document.body.clientHeight lesz screen.width és screen.height helyett de akkor rakd be a <body> tagbe ezt is: onresize="hatter()" előzmény
csináltam egy képet, a példád kedvéért hatter.jpg-ként mentettem el. Megcsináltam a hatter.php állományt (csak másoltam és beillesztettem a te kódod egy üres php állományba)

index.html- fájt úgyszintén. Egy mappába a kép+php+html)

Hát nekem nem működik.

Sajnálom nagyon , pedig biztos jó.

Sablonként szívesen használtam volna.

Igaz , ha megnyitom az index.html - legalább nem jelez ki hibát a javascript- de sajnos hó fehér semmiség marad a háttér. előzmény
Szia!

Én így csinálom és eddig jól működött:


<?php

// Ablak szélessségét menti el sütiben
if (!$_COOKIE['ablak_szelesseg']) { ?>
<script type="text/javascript">
<!--
if (window.screen.width == 1024 || window.screen.width == 1280)
  document.cookie = "ablak_szelesseg="+window.screen.width+"; expires=Fri, 31 Dec 2999 23:59:59 GMT;";
else if (window.screen.width <= 800)
  document.cookie = "ablak_szelesseg=1024; expires=Fri, 31 Dec 2999 23:59:59 GMT;";
else if (window.screen.width > 1280)
  document.cookie = "ablak_szelesseg=1280; expires=Fri, 31 Dec 2999 23:59:59 GMT;";
document.location.reload();
-->
</script>
<? }
$ablak_szelesseg = $_COOKIE['ablak_szelesseg'];
?>

<link rel="stylesheet" href="themes/<?=$ablak_szelesseg?>/style.css" type="text/css">
előzmény
MINTA

nekem jó előzmény
Szerk.: És így nem csak a hátteret tudod módosítani, mert azzal sokra nem mész, ha minden más marad abban a méretben, amiben tesztelted. Így az themes/1024 és a themes/1280 mappába betehetsz képeket és style.css-t így gykorlatilag akár két tök más oldalt is felépíthetsz css-sel. Tudsz módosítani div szélességet, fontméretet, hátteret, bármit... előzmény
és át is kell méretezned hozzá 99999999 képet a 9999999 fajta képernyőfelbontáshoz ami 9999999-szer több helyet fog elfoglalni a szerveren okos lehet hogy ez tényleg jobb előzmény
OK. Már nekem is jó.
Sorry

(olyan mappába mentettem és nyitottam meg ,amit nem fordít a php motorom) előzmény
és ezt minden alkalommal meg kell tenni, amikor egy új hátteret raksz be előzmény
Miért is kellene? Ha megnézed amit írtam én csak az 1024-gyel és 1280-nal foglalkozom, de a többi felbontást is kezeli, szóval minden képből kell egy másikat is csinálni ez igaz.
De még mindig takarékosabb, mint 999999999 képnél és 999999999 div backgroundnál a te php-dat meghívni, nem? Inkább plusz 10 Mb (ami már erős túlzás) a szerveren, mint monjduk 10-20 alkalommal végigfuttatni egy képátméretezős szkriptet.

Döntsd el te melyik a jobb

És lehet nem örülnék neki, ha minden egyes lapbetöltésnél nekem arra kellene várnom, hogy az 1024-es felbontásomhoz méretezzen a lapod egy 1600x1200-es képet például. Meg a szervert is sokkal jobban terheli. előzmény
én az időt sajnálnám rá és nem csak 2 felbontás létezik amúgy valóban jobb lenne ha meglennének előre a képek ezért itt egy jobb PHP script erre:

<?
$hatter="eredeti_hatter.jpg";

$szeles=$_GET['szeles'];
$magas=$_GET['magas'];

if(file_exists($szeles.'x'.$magas.'.jpg')){
@header("Location: ".$szeles."x".$magas.".jpg");
}else

if(($szeles==640 && $magas==480) or ($szeles==800 && $magas=600) or ($szeles==1024 && $magas=768) or ($szeles==1152 && $magas=864) or ($szeles==1280 && $magas=1024)){

$gau=@getimagesize($hatter);
$mag=floor($szeles*$gau[1]/$gau[0]);

if($mag!=$magas){
$magas=$mag;
}

$img=@imagecreatefromjpeg($hatter);
$dst=@imagecreatetruecolor($szeles,$magas);
@imagecopyresampled($dst,$img,0,0,0,0,$szeles,$magas,$gau[0],$gau[1]);
@imagejpeg($dst,$szeles.'x'.$magas.'.jpg');

@header("Location: ".$szeles."x".$magas.".jpg");

}else{
@header("Location: $hatter");
}
?>

A többi képernyő felbontást be lehet írogatni
Ha már létezik az user felbontásának megfelelő kép akkor azt adja be, ha nem létezik akkor létrehoz egyet és onnantól kezdve azt adja be! előzmény
Valószínűleg én is a te kódod használnám ha egyetlen egy hátteret kellene módosítgatni, mert így tényleg egyszerűbb.

De ez csak a kérdés 2. fele

Mi a trükkje annak, hogy egy weblapra beszúrt kép (vagy akár a szöveg) mindig ugyanolyan arányú helyen jelenjen meg, függetlenül a felhasználóknál összevissza állított képernyőfelbontásoktól.

Felzünk pontot? előzmény
sztem egy topic 1 kérdés de valóban itt 2 kérdés van előzmény
HA MÁR ÚGYIS KÉT KÉRDÉST TETTEM FEL , AKKOR MÉG AZT MONDJÁTOK MEG . Én csak fájlból beszúrt képet tudok, (vagy annak egy kijelölt szeletét) linkelni.
Csak én nem tudok vagy MÁS SEM tud háttérkép egy kijelölt szeletét meglinkeltetni ??
Sehogy nem lehet background-ként beállított kép egy cikkét meglinkelni ? előzmény
Oszd meg!