Obrázek   
Přihlášení
Uživatelské jméno:

Heslo:

Pamatovat si mne



Zapomenuté heslo

Nová registrace
Kam dále?
Hledání
Vzhled

(3 vzhledů)
Kdo je Online
16 uživatel(ů) je online (4 uživatel(ů) si prohlíží Články a povídání)

Uživatelé: 0
Hosté: 16

více...
Noví uživatelé
adamek
adamek
21. 08. 2017
ok9swl
ok9swl
21. 08. 2017
Morison
Morison
07. 08. 2017
tomsth
tomsth
02. 08. 2017
cerenice
cerenice
09. 07. 2017
kathliin
kathliin
06. 07. 2017
teufel
teufel
07. 05. 2017
vagabund
vagabund
14. 03. 2017
fuchs
fuchs
10. 03. 2017
haniball1973
haniball1973
05. 02. 2017
Kdo za co může
Administrátorka
Žirafka
Žirafka
Žirafička
Žirafička
Korektoři
KatyH
KatyH
Redaktoři
bernard
bernard

Zápisník pojídačky koláčů - Páska v rohu webu

Aneb jak zajímavého efektu dosáhnouti.
Napsal/a Žirafka v 23. 01. 2016 v 22:05 (přečtení 462×) Další články tohoto autora
Zápisník pojídačky koláčů
     Na různých webech jsem viděla takový zajímavý efekt a tím je páska přes roh stránky. Marně jsem přemýšlela, jak je to udělané a říkala si, že na to asi nikdy nepřijdu. Jenže pak jsem se pustila do pátrání a zjistila jsem, že to je vlastně hrozně jednoduché. Tedy teoreticky. Chvilku mi to stačilo ke spokojenosti, ale dneska jsem chtěla něco s podobnou páskou zkusit. A tak jsem se pustila do bádání přímo na svém pokusném webu a pak protože se mi efekt líbil, tak jsem jej dala i semka. V akci jej ale uvidí jen přihlášení čtenáři místo zeleného nadpisu.

     V čem je tedy ta veliká záhada tohoto efektu a celé jeho tajemství? V GIFu a jedné jeho vlastnosti a totiž průhlednosti jedné barvy. Nejprve je tedy potřeba si připravit obrázek, kde je namalovaná ona páska. Jakou bude mít barvu a jestli bude mít nějaké ozdoby není důležité. Co důležité je to, aby obrázek měl jednobarevný podklad a této barvě se pak nastaví průhlednost. Já to dělám třeba v programu Irfan View, ale umí to téměř všechny ostatní. Tedy krom Malování, které je součástí Windows. Alespoň těch mých, jestli to mají novější jinak, to nevím.

Kliknutím na obrázek otevřete nové okno s obrázkem v původní velikosti.
Obr. 1 – obrázek s páskou, pravá varianta


Kliknutím na obrázek otevřete nové okno s obrázkem v původní velikosti.
Obr. 2 – obrázek s páskou, levá varianta.


     Když je obrázek hotový, je potřeba do CSS souboru vložit něco podobného tomuto zápisu:

.paskavlevo  {positionabsolutetop0pxleft:50%; margin-left: -425px;}  
.
paskavpravo {positionabsolutetop0pxleft:50%; margin-left: +275px;}


     Jinak řečeno, je potřeba obrázek prostě „napoziocovat“ na správné místo a umístit jej tam absolutně, aby byl tam, kde být má. No a pak ve vlastním HTML souboru se objeví třeba takovýto zápis:

<{if $xoops_isuser == true}> 
    <
div class="paskavpravo"><img src="<{$xoops_imageurl}>images/paska_vpravo_zelena.gif" width="150" height="150" border="0" alt="Zelená páska" title="Zelená páska značí přihlášeného uživatele :-)"></div>
<{/if}>


     A tím je páska na svém místě. Jednoduché a velmi efektní Zde uvedené příklady jsou přímo z Žirafovin, pro svoje potřeby si je jistě snadno upravíte. Rozměry obrázku pochopitelně mohou být libovolné, nemusí to být mnou použitých 150 x 150 pixelů.

     Při používání barev je třeba myslet na to, že pokud je jedna průhledná, je průhledná na celém obrázku, ne jenom na pozadí, takže pokud bude mít stejnou barvu třeba text, bude v pásce „díra“, čehož se ale dá s úspěchem použít na další zajímavé efekty.



Aktualizace ze dne 24. ledna 2016

     Bohužel tu mám aktualizaci článku, neboli tiskovou opravu, protože jsem zjistila, že původní řešení dobře funguje v Opeře, Safari i Internet Exploreru, ale nefunguje ve Firefoxu.

     Naštěstí jsem ale našla řešení, koukáním jinam , a to řešení je vlastně jednodušší, než jsem původně vymyslela.

     Pozicování obrázku se nedá do CSS souboru, ale přímo do HTML souboru. Nějak takto:

<img src="<{$xoops_imageurl}>images/paska_vpravo_zelena.gif" style="position: absolute; top: 0; left:50%; margin-left: 275px;0;" width="150" height="150" border="0" alt="Zelená páska" title="Zelená páska značící přihlášeného uživatele :-)">


     Vypadá to, že všechny moje prohlížeče ukazují stránku stejně, takže snad už to tak bude i jinde. Jednou se z té různé interpretace zdrojových kódů stránek v různých prohlížečích asi zblázním. Ale teďka mám radost, že se to povedlo i bez zbláznění
Hodnocení: 10,00 (1 hlas) - Ohodnotit -
Formátovat pro tisk Poslat známému Vytvořit z článku PDF
 
Komentář je vlastnictvím svého autora. Vyjadřuje jeho názory, ne názory redakce nebo provozovatele webu či serveru.
Napsal/a Vlákno
host
Publikováno dne: 23. 1. 2016. 22:56  Aktualizováno dne: 23. 1. 2016. 22:56
 Splendid!
Jsem zcela ale úplně unešen.
Já si původně myslel, že to je smuteční páska za zvěčnělého europoslance!
Odpovědět
EKKAR
Publikováno dne: 23. 1. 2016. 23:04  Aktualizováno dne: 23. 1. 2016. 23:04
Dost toho napovídá
Datum registrace: 07. 12. 2008
Bydliště: v České Třebové
Počet komentářů: 281
 Odp: Splendid!
No ještě sem tahej toho puncovanýho megavola, kterej sice měl písmenek před jménem i za ním požehnaně, ale jinak byl blbej jak troky dlabaný z angreštový fošny ...
Odpovědět
Žirafka
Publikováno dne: 24. 1. 2016. 8:12  Aktualizováno dne: 24. 1. 2016. 8:12
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
Tak to jsou tedy zprávičky takto po ránu.

Vždycky je to smutné, když někdo umře a navíc takto rychle. Sice jsem toho vola skutečně nemusela, ale i tak je to smutná zpráva. Hlavně pro jeho rodinu a kamarády.

Jen koukám, že Opera zobrazovala "přihlašovací pásku" dobře, ale FireFox ji zobrazuje úplně špatně, či spíše úplně blbě. Musím se na to podívat. Tyto rozdíly v zobrazení v různých prohlížečích mne štvou.
Odpovědět
host
Publikováno dne: 24. 1. 2016. 8:55  Aktualizováno dne: 24. 1. 2016. 8:55
 Odp: Splendid!
Citát:
Tyto rozdíly v zobrazení v různých prohlížečích mne štvou.


kdyby se mi nezobrazovalo kvůli rozdílům v prohlížečích zapojení konektoru, které půl dne jak HUPS hledám tak to by bylo nemilé, smuteční pásku špatně zobrazenou zkusím nějak přežít
abychom nakonec nestrávili zbytek života ve formě bez obsahu
Odpovědět
Žirafka
Publikováno dne: 24. 1. 2016. 8:58  Aktualizováno dne: 24. 1. 2016. 8:58
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
To není smuteční páska a už vůbec ne za Ransdorfa. Obsah je důležitější než forma, ale i forma je důležitá, protože obsah bez formy jaksi není ono.
Odpovědět
host
Publikováno dne: 24. 1. 2016. 8:58  Aktualizováno dne: 24. 1. 2016. 8:58
 Odp: Splendid!
Citát:
a navíc takto rychle


to se někdy stává, zvlášť když je požadavek na rychlý výběr hotovosti v řádu miliard a ono se to nepovede. Soudruh europoslanec to asi nevysvětlil svým dobrodincům akceptovatelným způsobem.

Každopádně mu patří pomník, první komunista, který si plně uvědomoval že leninské ideály musí mít především masivní materiální základnu, nejlépe ve zlatě.
Odpovědět
host
Publikováno dne: 24. 1. 2016. 9:01  Aktualizováno dne: 24. 1. 2016. 9:01
 Odp: Splendid!
Ano, teprve páska dává technicky zaměřenému webu tu správnou formu, takže je to ono i obsahově!
Odpovědět
Žirafka
Publikováno dne: 24. 1. 2016. 11:30  Aktualizováno dne: 24. 1. 2016. 11:32
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
A co těm, komu se toto nelíbí brání v tom, vypnout si zobrazování s pomocí stylopisu a tím vidět jen čistou stránku bez efektů a ozdob?

Tedy téměř bez efektů, některé se vypnout nedají, protože jsou tvořené přímo HTML.

Navíc článek není o tom, proč a kde pásku mít, ale o tom, jak ji na stránku dostat a to je technický problém, ne estetický A že to problém může být je vidět i z toho, že Firefox ji původně zobrazoval jinde, než zbytek prohlížečů.
Odpovědět
Žirafka
Publikováno dne: 24. 1. 2016. 11:33  Aktualizováno dne: 24. 1. 2016. 11:34
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
Citát:
Každopádně mu patří pomník, první komunista, který si plně uvědomoval že leninské ideály musí mít především masivní materiální základnu, nejlépe ve zlatě.


Tak to věděli již "otcové zakladatelé" jako Karl Marx, Friedrich Engels i Vladimír Iljič Uljanov a další
Odpovědět
bernard
Publikováno dne: 24. 1. 2016. 14:14  Aktualizováno dne: 24. 1. 2016. 14:19
Redaktor
Datum registrace: 07. 02. 2009
Bydliště:
Počet komentářů: 78
 Odp: Splendid!
Chodívám sem přes Chrome, tak mohu dosvědčit, že v jeho podání je proužek na svém místě, formu má lichoběžníkovou a obsah zelený. Naopak zmizely proužky ve vyhodnocení ankety, asi je zničil ten side-effect průsvitné barvy.

Edit: Už to v anketě je, nebo jsem byl momentálně slepej?
Odpovědět
Žirafka
Publikováno dne: 24. 1. 2016. 18:54  Aktualizováno dne: 24. 1. 2016. 18:54
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
Děkuji za ověření v dalším systému

Co způsobilo to "zmizení" pruhů nevím, s páskou by to nemělo souviset, protože to jsou různé obrázky a průhlednost se nastavuje přímo ve vlastnostech obrázku (je to jedna z vlastností GIFu) ne nikde jinde.

Možná za to ale mohlo čištění vyrovnávací paměti, čas od času je potřeba ji vyprázdnit a dneska jsem to dělala, možná jsme se potkali.
Odpovědět
host
Publikováno dne: 25. 1. 2016. 11:00  Aktualizováno dne: 25. 1. 2016. 11:00
 Odp: Splendid!
Citát:
A co těm, komu se toto nelíbí brání v tom, vypnout si zobrazování s pomocí stylopisu

to jsou jen roztomilé tanečky s tím, co jsem skrze formu a obsah právě zažil při podávání přiznání z DPH:
posledně mi úřednice vrazila papír s varováním, že od roku 2016 se musí odevzdávat ještě KONTROLNÍ HLÁŠENÍ a to v elektronické formě, aby úřad věděl kde se skrývá finanční zločin a mohl proti němu zakročit. No a jako kvartální plátce tedy podám KONTROLNÍ HLÁŠENÍ k potírání své finanční kriminality v elektronické formě prostřednictvím datové schránky zřízené pod dohledem ministerstva vnitra a všichni budeme hepy. Někdy koncem dubna za první kvartál.
Dnes mi ouřednice vrátila papírové přiznání za loňský rok, že ačkoliv je za loňský rok a je to přiznání nikoliv KONTROLNÍ HLÁŠENÍ, tak už i loňské přiznání musím podat v elektronické podobě, vrazila mi instrukce v papírové formě, jak posílat přiznání v elektronické formě, a na závěr pronesla, nekecám,
NA WEBU SI TO VYPLNÍTE, TO VÁS POVEDE KROK ZA KROKEM A PAK TEN PAPÍR, CO VÁM VYJEDE Z TISKÁRNY, PŘINESETE SEM, ABYSME MĚLI POTVRZENÍ, ŽE JSTE PŘIZNÁNÍ V ELEKTRONICKÉ FORMĚ PODAL.
Nekecám a jsem střízlivý. Tohle by nevymyslel Kafka, Werich, Cimrman, nikdo by to nevymyslel. To vymyslí jen úředník. To je snad česká národní infekce?
Nebo to sem zanesl ten HUPSý migrant HUPS Bureš z HUPSého ministerstva financí? Bratia, proč jste si toho HUPSa nenechali v Bratislavě?
Vždycky když poslední dobou navštívím FÚ mám pocity, jaké asi měl pan Harman z Bratislavy. Toho jste měli, bratia ušetřit a poslat sem místo HUPSa Bureše.
takže asi tak k formám a obsahům...
Odpovědět
host
Publikováno dne: 25. 1. 2016. 20:52  Aktualizováno dne: 25. 1. 2016. 20:52
 Odp: Splendid!
Žirafko, jen si tak říkám jestli znáš rozšíření Firebug pro Firefox…
Odpovědět
Host
Publikováno dne: 26. 1. 2016. 15:11  Aktualizováno dne: 26. 1. 2016. 17:54
 Odp: Splendid!
tys někoho tou páskou musela mocně zainspirovat, to jinak není možný

Kliknutím na obrázek otevřete nové okno s obrázkem v původní velikosti.
Odpovědět
Žirafka
Publikováno dne: 26. 1. 2016. 17:53  Aktualizováno dne: 26. 1. 2016. 17:53
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
Citát:
Žirafko, jen si tak říkám jestli znáš rozšíření Firebug pro Firefox…


Neznám, ale mrknu na to.
Odpovědět
Žirafka
Publikováno dne: 26. 1. 2016. 17:55  Aktualizováno dne: 26. 1. 2016. 17:55
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
No nevím nevím. Poslední dobou mi veřejná doprava spíše zvyšuje tlak a pak vidím "opencardově"
Odpovědět
host
Publikováno dne: 5. 2. 2016. 19:53  Aktualizováno dne: 5. 2. 2016. 19:53
 Odp: Splendid!
Když už jsme u těch nových zajímavých efektů a zvyšování tlaku, nevíš jak u Opery v.12.15 dosáhnout odstranění reklamy co vyjíždí odspodu na blog.cz? doplněk na webu rozšíření Opery nabízí Adblock jen za podmínky že si stáhnu poslední verzi prohlížeče to nemám zájem.
Před časem jsem to nějak podle nějakýho postupu zablokoval, ale zase se to teď objevilo.
Odpovědět
Žirafka
Publikováno dne: 5. 2. 2016. 21:20  Aktualizováno dne: 5. 2. 2016. 21:20
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
To by zajímalo i mne, protože mne ta reklama neskutečně otravuje. Ačkoli jsou i horší případy, ale i tak mi leze na nervy.

Když je aktivní Adblock, tak se zase často objevuje nápis, že to je špatně, protože autor webu pak nemá příjem z reklamy a tím že já používám Adblock tak ho přivedu na mizinu a jeho děti půjdou do děcáku a on na ulici. Prostě citové vydírání.

Nicméně, opět jsme poněkud hodně daleko od tématu článku
Odpovědět
host
Publikováno dne: 5. 2. 2016. 23:49  Aktualizováno dne: 5. 2. 2016. 23:49
 Odp: Splendid!
Citát:
a jeho děti půjdou do děcáku a on na ulici


tak k dětem jsem se teda ještě nedopracoval
dotáhl jsem to nejdál k představě, jak vyklízí serverovnu a ČEZák zatím sundává elektroměr.
Odpovědět
Žirafka
Publikováno dne: 6. 2. 2016. 13:07  Aktualizováno dne: 6. 2. 2016. 13:07
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
Mám prostě bujnější fantazii
Odpovědět
host
Publikováno dne: 6. 2. 2016. 17:51  Aktualizováno dne: 6. 2. 2016. 17:51
 Odp: Splendid!
to se časem srovná, neboj.
žirafoviny nemají definovanou barvu posuvníků?, když sem přijdu ze stránky která barvu změní tak zůstane třeba fialovozelená.
Odpovědět
Žirafka
Publikováno dne: 6. 2. 2016. 20:37  Aktualizováno dne: 6. 2. 2016. 20:37
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
Zatím nemají, ale možná se to do budoucna změní. Nepřipadalo mi to důležité, ačkoli, když o tom tak přemýšlím, je to hezká hračka
Odpovědět
host
Publikováno dne: 7. 2. 2016. 7:33  Aktualizováno dne: 7. 2. 2016. 7:33
 Odp: Splendid!
néé proboha ta nerušivá šedá je optimální, jen žádný hraní s HUPSovinama já myslel že když není definován normální stav, tak po návštěvě frikulínské stránky tam ten pouťový prvek zůstane protože ho po sobě neumí uklidit.
Odpovědět
Žirafka
Publikováno dne: 7. 2. 2016. 7:56  Aktualizováno dne: 7. 2. 2016. 7:56
Administrátorka
Datum registrace: 04. 05. 2008
Bydliště: Ústecký kraj
Počet komentářů: 1531
 Odp: Splendid!
Já mám posuvníky zelené

Ale zjistila jsem, že změna není tak snadná, jak to na první pohled vypadalo a protože mi současný stav vyhovuje, tak další bádání nechám na dobu, až nebudu mít co dělat. Takže to asi bude ještě v tomto tisíciletí, ale jisté to úplně není.

Překvapuje mne však skutečnost, že si prohlížeč pamatuje nastavení minulé stránky, asi to budu muset někde vyzkoušet, jen co najdu nějakou stránku, kde je posuvník obarvený.
Odpovědět
host
Publikováno dne: 8. 2. 2016. 10:41  Aktualizováno dne: 8. 2. 2016. 10:41
 Odp: Splendid!
taky si myslím, že se nic nestane jestli to počká do dalšího milénia.
Odpovědět
Obrázek Obrázek
ObrázekObrázekObrázekObrázekObrázek
Obrázek
Redakční systém XOOPS 2.5.8.1 © 2001-2017
Obsah © 2008-2017 Žirafoviny