PHP rajzolás - Mennyire éri meg? Lassítja e a betöltést ha háttérkép helyett PHP-val adom meg a hátteret?
Nézegetem a PHP-vel rajzolgatás módszereit az interneten, kicsit kezdő vagyok még a dolgokban. szóval az a kérdésem hogy pl ha PHP-ban adok meg egy kisebb képet jobban lelassíthatja e a szervert minthogyha pl egy gif file-ot rakok fel FTP-re és akkor az a háttérkép ? vagy ez függ e a kép bonyolultságától is?
Bár bizonyos helyzetekben lehet jobb a php, például ha egy nagyobb szövegmezőnek akarok hátteret akkor változhat a háttér mérete, hossza szélessége, bár egy háttérképet is lehet nyújtani de ha nem találjuk el a méretet lehet hogy pixeles lesz. pl olyat szeretnék hogy szép színátmenetet kapjunk a háttérnek hogy pl a bal oldala világosabb kék a jobb oldala sötétebb kék és a közepe meg egy szép egyenletes színátmenet a két szín között, pl ennek hogy van a kódja ? vagy egy átlós színátbenet hogy bal felső sarok sötétkék és a jobb alsó sarok meg világoskék.
Meg pl kellene nekem PHP-ban valami olyan függvény ami kiszámolja egy adott táblázatba include-val beillesztett szövegrész hosszát hogy az adott cellának mekkora a mérete és a függvény annak a méretnek megfelelően csinálja meg a háttérképet. pl ehhez még egy felbontásérzékelő függvény is kellene.
lehet egyszerre kicsit sokat akarok, de akkor csak annyi a kérdésem honnan indulhatok el? hol vannak erről leírások ?
A megjelenítéshez használj sima képeket, a php-s rajzolás elég költséges dolog és csak meghatározott esetekben szokás használni. (Pl dinamikus avatar készítése, de itt sem árt bufferelni a képet és nem mindig újra-újra rajzolni.)
Amiket kérdeztél azok html-el és css-el simán megoldhatóak.
CSS-ben most találtam egy megoldást, de forráskódot nézve nem szép látvány:
<style type="text/css">
.right {text-align:right; height:auto;}#d1 {background-color:rgb(255,255,0)}
#d2 {background-color:rgb(255,255,1)}
#d3 {background-color:rgb(255,255,2)}
#d4 {background-color:rgb(255,255,3)}
#d5 {background-color:rgb(255,255,4)}
#d6 {background-color:rgb(255,255,5)}
#d7 {background-color:rgb(255,255,6)}
#d8 {background-color:rgb(255,255,7)}
#d9 {background-color:rgb(255,255,8)}
#d10 {background-color:rgb(255,255,9)}
#d11 {background-color:rgb(255,255,10)}
#d12 {background-color:rgb(255,255,11)}
#d13 {background-color:rgb(255,255,12)}
#d14 {background-color:rgb(255,255,13)}
#d15 {background-color:rgb(255,255,14)}
#d16 {background-color:rgb(255,255,15)}
#d17 {background-color:rgb(255,255,16)}
#d18 {background-color:rgb(255,255,17)}
#d19 {background-color:rgb(255,255,18)}
#d20 {background-color:rgb(255,255,19)}
#d21 {background-color:rgb(255,255,20)}
#d22 {background-color:rgb(255,255,21)}
#d23 {background-color:rgb(255,255,22)}
#d24 {background-color:rgb(255,255,23)}
#d25 {background-color:rgb(255,255,24)}
#d26 {background-color:rgb(255,255,25)}
#d27 {background-color:rgb(255,255,26)}
#d28 {background-color:rgb(255,255,27)}
#d29 {background-color:rgb(255,255,28)}
#d30 {background-color:rgb(255,255,29)}
<!--//..stb-->
</style>
</head>
<body>
<div id="d1"><!-- --></div>
<div id="d2"><!-- --></div>
<div id="d3"><!-- --></div>
<div id="d4"><!-- --></div>
<div id="d5"><!-- --></div>
<div id="d6"><!-- --></div>
<div id="d7"><!-- --></div>
<div id="d8"><!-- --></div>
<div id="d9"><!-- --></div>
<div id="d10"><!-- --></div>
<div id="d11"><!-- --></div>
<div id="d12"><!-- --></div>
<div id="d13"><!-- --></div>
<div id="d14"><!-- --></div>
<div id="d15"><!-- --></div>
<div id="d16"><!-- --></div>
<div id="d17"><!-- --></div>
<div id="d18"><!-- --></div>
<div id="d19"><!-- --></div>
<div id="d20"><!-- --></div>
<div id="d21"><!-- --></div>
<div id="d22"><!-- --></div>
<div id="d23"><!-- --></div>
<div id="d24"><!-- --></div>
<div id="d25"><!-- --></div>
<div id="d26"><!-- --></div>
<div id="d27"><!-- --></div>
<div id="d28"><!-- --></div>
<div id="d29"><!-- --></div>
<div id="d30"><!-- --></div>
<!--//..stb-->
<div
style="position: absolute; top: 10px; left: 10px; width: 600px; height: 500px;">
szövegmező rétegbeillesztéssel
</div>
meg hasonló megoldások:
Nincs valami szebb és kevésbé hosszú ?
Ha a problémád az, hogy nem szeretnél lób*szó nagy méretű képet feltenni de szeretnél egy igényes szép háttérképet feltenni itt egy megoldás:
Szerezd be/ készítsd el a képet HD-ben (1920*1080px)
Mentsd el, szerezz be egy alkalmazást amivel átméretezheted a képet aztán méretezd át 640x480 arányban ( kivéve ha fontos apró részletek vannak akkor inkább 800x600 vagy 1024x768 )
Aztán töltsd föl ftp-n
a css-ben a háttérképnek hívd be a már átméretezett képet aztán - feel the power of CSS3 - aminek megadtad ezt a háttérképet add meg ezt a tulajdonságot is : background-size: cover
Tehát pl.:
body{
background-image: url(hatterkep.png);
bakcground-size: cover;
background-position: center center;
}
Ekkora a monitor szélességéhez igazodva a böngésző nagyítja a kisméretű képet általában jó minőségben.
Ha az úgynevezett "hekkerekkel" van bajod ... nem érdemes azzal szórakozni hogy "jajj lelopják a háttérképem" ... mert ígyis úgy is lelehet szedni.
Kapcsolódó kérdések:
Minden jog fenntartva © 2024, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!