Archívum - 2014
július 2
Responsive/Adaptive kép megoldások
Sziasztok!
A következő helyzetre keresek használható megoldást:
Teljes képernyő szélességű képeket szeretnék megjeleníteni ( min 1920x500 ), rugalmasan. Nem galéria, egy oldalon csak 1 db, dinamikusan kapom, kvázi háttérkép.
De nem tényleges background-image, mert nem akarom minden eszközre és sávszélességre ezt lekérni. Böngészgettem milyen megoldások léteznek erre a feladatra és kipróbáltam a HiSrc.js -t.
( Sajnos a szép, egyszerű szabvány, az srcset még várat magára... )
Ami tetszik benne, hogy ellenőrzi a sávszélességet, egyszerű a beillesztése és magam szerkeszthetem meg a képeket, nem csak lekicsinyíti.
Ezzel szemben - amennyire megértettem a módszert - 2 dolgot ellenőriz összesen, a sávszélességet és a window.devicePixelRatio értéket. 3 képet adhatok meg: 1 - az alacsony sávszélességre ( mobil eszközre ) egy alacsony méretet/minőséget, 2 - gyors netre + pixelRatio = 1 - re ( pl asztali monitor ), 3 - gyors net + pixelRatio > 1 -re ( ezek szintén lehetnek retina mobil eszközök ).
Tehát, ha gyenge a net akkor akkor a kis kép megy ez rendben van, ne kelljen letölteni a nagyot. A 2-es verzióra állítanám a 'normális' képet amit megkap a desktop és a 3-as lenne elvileg akkor kicsit kisebb retinára optimalizált kép. Csakhogy van mobil eszköz is ( pl Iphone3g ) ami ugyan úgy pixelRatio = 1 és akkor wifin a desktop képet kapná. Teljesen felesleges ekkora képet küldeni rá. Illetve más felbontásokra is kisebb képeket kellene küldeni vagy más pontra fókuszálva, mivel a rugalmasságot egyszerűen width = 100% oldottam meg és egy ekkora kép nem feltétlenül mutat jól teljesen lekicsinyítve.
Van tapasztalatotok ezzel a módszerrel?
Kérdezném, hogy teljesen jól értem e a lényegét?
Tudtok esetleg tanácsolni valamilyen jobb eljárást?
Köszönöm, a segítséget!
■ A következő helyzetre keresek használható megoldást:
Teljes képernyő szélességű képeket szeretnék megjeleníteni ( min 1920x500 ), rugalmasan. Nem galéria, egy oldalon csak 1 db, dinamikusan kapom, kvázi háttérkép.
De nem tényleges background-image, mert nem akarom minden eszközre és sávszélességre ezt lekérni. Böngészgettem milyen megoldások léteznek erre a feladatra és kipróbáltam a HiSrc.js -t.
( Sajnos a szép, egyszerű szabvány, az srcset még várat magára... )
Ami tetszik benne, hogy ellenőrzi a sávszélességet, egyszerű a beillesztése és magam szerkeszthetem meg a képeket, nem csak lekicsinyíti.
Ezzel szemben - amennyire megértettem a módszert - 2 dolgot ellenőriz összesen, a sávszélességet és a window.devicePixelRatio értéket. 3 képet adhatok meg: 1 - az alacsony sávszélességre ( mobil eszközre ) egy alacsony méretet/minőséget, 2 - gyors netre + pixelRatio = 1 - re ( pl asztali monitor ), 3 - gyors net + pixelRatio > 1 -re ( ezek szintén lehetnek retina mobil eszközök ).
Tehát, ha gyenge a net akkor akkor a kis kép megy ez rendben van, ne kelljen letölteni a nagyot. A 2-es verzióra állítanám a 'normális' képet amit megkap a desktop és a 3-as lenne elvileg akkor kicsit kisebb retinára optimalizált kép. Csakhogy van mobil eszköz is ( pl Iphone3g ) ami ugyan úgy pixelRatio = 1 és akkor wifin a desktop képet kapná. Teljesen felesleges ekkora képet küldeni rá. Illetve más felbontásokra is kisebb képeket kellene küldeni vagy más pontra fókuszálva, mivel a rugalmasságot egyszerűen width = 100% oldottam meg és egy ekkora kép nem feltétlenül mutat jól teljesen lekicsinyítve.
Van tapasztalatotok ezzel a módszerrel?
Kérdezném, hogy teljesen jól értem e a lényegét?
Tudtok esetleg tanácsolni valamilyen jobb eljárást?
Köszönöm, a segítséget!
július 1
Highcharts JS kinézet módosítás.
Adva van egy Pie chart, mint pl itt:
http://www.highcharts.com/demo/pie-basic
A cikkek mellett a labelek előtt szereplő vonal méretét kellene nekem szabályozni- konkrétan azt, hogy a jelenlegi méretnek kb 1/3-a legyen hosszra.
Néztem már a configot és fogom is, de ha valaki már találkozott vele, vagy van ötlete, azt szívesen veszem.
Köszönöm!
■ http://www.highcharts.com/demo/pie-basic
A cikkek mellett a labelek előtt szereplő vonal méretét kellene nekem szabályozni- konkrétan azt, hogy a jelenlegi méretnek kb 1/3-a legyen hosszra.
Néztem már a configot és fogom is, de ha valaki már találkozott vele, vagy van ötlete, azt szívesen veszem.
Köszönöm!
június 30
"free" könyvek
Sziasztok
Update: mindegyik könyvet elvitték.
Van pár könyv amit felajánlanék:
- (lefoglalva) Apache zsebkönyv.
- (lefoglalva) Hogyan törjük fel a webhelyeket.
- (lefoglalva) Webalkalmazások fejlesztése Ajax segítségével.
- (lefoglalva) Tanuljuk meg a JavaScript használatát 24 óra alatt.
- (lefoglalva) Tanuljuk meg a MySQL használatát 24 óra alatt.
- (lefoglalva) Adatbázis tervezés.
Egyik könyvért se kérek én pénzt, a postát is állom Mo-n belül. Viszont az aki egy könyvet elvisz, az hogy ha egy tetszőleges közhasznú alapítványt támogatna 500 Ft-al, annak örülnék :-)
Könyvért jelentkezni itt a weblabor-on hozzászólásban lehet.
■ Update: mindegyik könyvet elvitték.
Van pár könyv amit felajánlanék:
- (lefoglalva) Apache zsebkönyv.
- (lefoglalva) Hogyan törjük fel a webhelyeket.
- (lefoglalva) Webalkalmazások fejlesztése Ajax segítségével.
- (lefoglalva) Tanuljuk meg a JavaScript használatát 24 óra alatt.
- (lefoglalva) Tanuljuk meg a MySQL használatát 24 óra alatt.
- (lefoglalva) Adatbázis tervezés.
Egyik könyvért se kérek én pénzt, a postát is állom Mo-n belül. Viszont az aki egy könyvet elvisz, az hogy ha egy tetszőleges közhasznú alapítványt támogatna 500 Ft-al, annak örülnék :-)
Könyvért jelentkezni itt a weblabor-on hozzászólásban lehet.
június 28
Datalist attribútumainak elérés
Hogyan lehete a HTML5-ös datalist elem attributumait elérni és milyen eseménykezelővel? Azt szeretném az input elem valamilyen definiált data-* paraméterének átadni, hogy majd azt adja át az URL-nek és nem az ékezetes formát. Itt a kód:Azért adom meg a value értékeinek az ékezetes formát, mert azt szeretném, ha a felhasználó így írhatná be rendesen ékezetesen és úgy is dobná fel. Átadásnál viszont a data-value értékeit szeretném átadni, a nem ékezetes formát, hogy az URL-ben ékezet nélkül szerepeljen. Ez csak egy egyszerősített példa, a valóságban komplexebb. Előre is köszi
■
<input id=nev list=nevek>
<datalist id=nevek>
<option value="János" data-value="janos">
<option value="Péter" data-value="peter">
<option value="Pál" data-value="pal">
</datalist>
Angular js - mire jó, mikor alkalmazható
Sziasztok!
Mostanában kezdtem ismerkedni az angularjs-el, de még nem állt össze teljesen a kép, hogy ezt pontosan mikor és mire érdemes használni.
Egyelőre egy admin felülethez, hibrid módon használom. A képfeltöltést (angular + plupload) pl. nagyon szépen meg lehetett csinálni vele, minimális markup és js kód felhasználásval.
De szeretném a képeket drag'drop módon rendezni, és a sortable feature-hez már jquery és jquery-ui is kell. Továbbá szeretném a képeket lightboxban, nagyítva is megnézni.
Innentől nekem kicsit fura érzésem van, hogy egy ilyen, viszonylag alap fícsörhöz be kell még húzni egy rakás js-t. Ez így normális? (tudom, írjam meg magamnak :) )
Ok, admin oldalon + 100 kB javascript nem olyan vészes, de frontenden, amit pl. sokan telefonról néznek 1-2 plusszban behúzott js library nem igazán nyerő (gondolom én).
Akinek van már tapasztalata tudna valami iránymutatást adni, hogy mikor és hogyan érdemes ezt használni?
■ Mostanában kezdtem ismerkedni az angularjs-el, de még nem állt össze teljesen a kép, hogy ezt pontosan mikor és mire érdemes használni.
Egyelőre egy admin felülethez, hibrid módon használom. A képfeltöltést (angular + plupload) pl. nagyon szépen meg lehetett csinálni vele, minimális markup és js kód felhasználásval.
De szeretném a képeket drag'drop módon rendezni, és a sortable feature-hez már jquery és jquery-ui is kell. Továbbá szeretném a képeket lightboxban, nagyítva is megnézni.
Innentől nekem kicsit fura érzésem van, hogy egy ilyen, viszonylag alap fícsörhöz be kell még húzni egy rakás js-t. Ez így normális? (tudom, írjam meg magamnak :) )
Ok, admin oldalon + 100 kB javascript nem olyan vészes, de frontenden, amit pl. sokan telefonról néznek 1-2 plusszban behúzott js library nem igazán nyerő (gondolom én).
Akinek van már tapasztalata tudna valami iránymutatást adni, hogy mikor és hogyan érdemes ezt használni?
június 24
Div link létrehozása
Sziasztok, bérelünk egy webáruházat sajnos a teljes kódhoz nem férhetünk hozzá. Amiben kérem az ötleteket:
van egy div amibe css-be belehelyeztem egy képet a gyártok lógójával.Sajnos nem tudunk diveket létrehozni, de meg kéne oldani, hogy a különböző gyártói logókra kattintva behívjon egy adott URL-t.
SAJNOS NEM TUDUNK DIV-t létrehozni!!!
Üdv,
Zsolt
■ van egy div amibe css-be belehelyeztem egy képet a gyártok lógójával.Sajnos nem tudunk diveket létrehozni, de meg kéne oldani, hogy a különböző gyártói logókra kattintva behívjon egy adott URL-t.
SAJNOS NEM TUDUNK DIV-t létrehozni!!!
Üdv,
Zsolt
<div style="width:100%">
Jó napot !
Érdeklődni szeretnék a címben jelzett kódrészlet értelmével kapcsolatban, mivel a neten számtalanszor botlom bele.
Előre is köszönöm a segítséget.
■ Érdeklődni szeretnék a címben jelzett kódrészlet értelmével kapcsolatban, mivel a neten számtalanszor botlom bele.
Előre is köszönöm a segítséget.
június 22
JavaScript hide and show div probléma
<head>
<meta charset="utf-8">
<title>Hide and show</title>
<style>
.text_container {
text-align: left;
width: 500px;
color: #000;
background-color: #ddd;
border: solid 1px #777;
margin: 0 auto 10px;
padding: 10px;
cursor: pointer
}
.text_container div p {
cursor: default !important;
margin-bottom: 10px
}
.visible>div {
display: block;
font-size: 17px;
}
form,
.subscribe:hover>div,
.hidden>div {
display: none
}
</style>
</head>
<body>
<div class="text_container">
<h2>Doboz</h2>
<div>
<p><a href="http://www.weblabor.hu" target="_blank">Home</a> Leírás </p>
</div>
</div>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.text_container').addClass("hidden");
$('.text_container').click(function() {
var $this = $(this);
if ($this.hasClass("hidden")) {
$(this).removeClass("hidden").addClass("visible");
} else {
$(this).removeClass("visible").addClass("hidden");
}
});
});
</script>
</body>
</html>
június 20
Maximum execution time of 30 seconds exceeded hiba
Van egy ilyen forráskódrészletem, amelyben a keresés során talált szövegekben az összes keresett szó összes előfordulását kiemeli a mark html tag-gel:De a fenti hibát produkálja. És az a gáz, hogy ha a mark helyett em-et írok már jó, de ha egy 3 karakteres html tag-gel emelem ki (mondjuk próba képpen a sup) akkor már jó, sőt ha a nyitó vagy a záró markból csak egyetlen karaktert is kiemelek, akkor sem ír már hibaüzenetet. Pont azzal az egyetlen karakterrel lesz tele a hócipője.
■
$j=1;
mysql_data_seek($lekerdezes,0);
while ($rekord=mysql_fetch_array($lekerdezes))
{
$szoveg=$rekord['szoveg'];
for ($k=0; $k<count($keresendok); $k++)
{
$keresendo_hossz=mb_strlen($keresendok[$k],'UTF-8');
$alap_poz=0;
while (mb_strpos(mb_strtolower($szoveg,'UTF-8'),mb_strtolower($keresendok[$k],'UTF-8'),$alap_poz,'UTF-8')!==false)
{
$szoveg_hossz=mb_strlen($szoveg,'UTF-8');
$kezdo_poz=mb_strpos(mb_strtolower($szoveg,'UTF-8'),mb_strtolower($keresendok[$k],'UTF-8'),$alap_poz,'UTF-8');
$veg_poz=$kezdo_poz+$keresendo_hossz;
$szoveg=mb_substr($szoveg,0,$kezdo_poz,'UTF-8') . "<mark>" . mb_substr($szoveg,$kezdo_poz,$keresendo_hossz,'UTF-8') . "</mark>" . mb_substr($szoveg,$veg_poz,$szoveg_hossz,'UTF-8');
$alap_poz=$veg_poz+1;
}
}
echo " <p><strong>" . $j++ . ".</strong> " . $szoveg . " <em><a href='valami_link.php'>" . $valami . "</a></em></p>\n";
}