Html-, css- és php-help

Azt hogyan kell megoldani ha átlátszora akaron késziteni a weblap táblázatait, hogy alatta látszodjon a háttér, de a táblázatokba betöltött tartalmakra ne vonatkozzon az átlátszoság?
Lehetöleg HTML vagy CSS-ben.
ezt az oldalamat akarom teljesen átdolgozni
Mint láthato a galéria képei is átlátszodnak és valamiért a clearboxon a JScriptes foldgomb is.

CCS-ben meghataroztam egy kepnek ezt az attributumot:

max-width:400px;

Igy azt ertem el, hogy ha a kep mondjuk 320px szeles, akkor 320px szelesen jelenik meg de ha a kep 450px szeles, akkor 400px szelesen jelenik meg?

Nem tudtok véletlenül valami jó kis leírást/tutorialt/könyvet, ami modernebb megközelítésbõl tanítja meg a JS-t?

Az a helyzet, hogy fél éve használom már a JQuery-t elég szép sikerekkel, de lassan nem ártana hozzá egy kis felsõszintû JavaScript tudás is, mert kb a szelekciókon, a változó és függvénydeklarációkon, window, document objektumok alapfunkcióin kívül mást nem nagyon tudok. Persze eddig elég volt a JQuery meg ez a kis alaptudás, de komolyabb AJAX megoldásokhoz optimizációs szempontból jobb lenne JS-el legeneráltatnom azokat a dinamikus tartalmakat, amikhez nem szükséges PHP sem adatelérési, sem biztonsági szempontból, pl a regisztrációs formom jelenleg a két jelszó egyezésénék összehasonlítását is PHP-val végzi <#idiota> Persze ez hülye példa, mert JS-ben sem kéne hozzá több, mint egy szelekció, de van 1000 más ellenõrzés, amin átfutnak a formba írt adatok, azokat meg eddig csak PHP-val tudtam megoldani.

A lényeg, hogy eddig amilyen írásokat találtam, azok mind ilyen document.write színvonalú dolgokat tanítanak, elavult DOM kezelési technikákat, amik JQueryvel ma már teljesen kiválthatóak. Olyat keresek, ami nem az ilyen, már feleslegessé vált dolgokra koncentrál, hanem sokkal inkább a JS fejlettebb lehetõségeit tanítja meg, gondolok itt az alap szintaktikai szabályoktól kezdve az adattípusokra, függvényekkel kapcsolatos lehetõségekre, eseménykezelésre, handlerek használatára, stb, szal amik JQueryvel kiegészítve ütõs kombót alkotnak manapság. A tutorial jellegû, példákkal szemléltetett írásokat elõnyben részesítem, szeretek olvasni, de nem 600 oldalt.

Elõre is kösz, ha tudtok valamit ajánlani.

Nem teljesen úgy kéne. A gradient kéne a kép tetejére, méghozzá úgy, hogy a kép széleihez közel elkezdõdjön az alpha channeles gradient, szép átmenetesen végül teljesen elfeketítve a kép széleit körbe.

De végülis ez mindegy, ha kezeli az alpha channelt normálisan a GD, akkor valóban megoldható 😊

Javascript hack. 😊
http://www.mogyi.hu/crassshgame/toplist.php

rajzolsz photoshopban egy ilyen gradientet, beolvasod phpben és egy kicsit nagyobbra méretezed mint a képed, aztán rárajzolod a tetejére a képet, render.

Már ha nem találsz gradient függvényt 😊

Amúgy csak arra kéne, hogy van egy feltölteni kívánt kép, azt méretezi+resample (ilyet már csináltam évekkel ezelõtt is), de kéne rá egy ilyen keret is, hogy beleolvadjon a fekete háttérbe.

Vagy mégsem, nekem valami GD2 alapú megoldás kell, külsõ PHP pluginekre nem merek alapozni a prekonfigurált tárhelyek miatt. Virtuális/saját szervert emiatt nem erõltethetek a megrendelõre...

Azt GD-vel is lehet. 😊

Tényleg amúgy ezt az imagemagik-et meglesem majd, remélem lehet vele fekete-átlátszó gradient keretet tenni vele a képekre 😊

Jaja már megvan (php-gd lib mindenre jó😊).

Na lol 3 hsz 3 különbözõ ember, ugyanaz a válasz 3 féleképpen 😄

Áh, már látom is😊 Nem figyeltem az info kimetere😊

Nem ismerem eléggé még a PHP-s image library-ket, de sztem úgy megoldható, hogy a jquery-s szerkesztõ csak preview, és a php végezné a piszkos munkát, az meg tud képet menteni.

A kérdés csak az, hogy mennyire lehet összehangolni a két rendszert.

Ajaxal hívunk egy php imagemagick-et. A böngészõvel megjelenített képet amúgysem szeretném elmenteni mert elég torz, ráadásul jó eséllyel minden böngészõn másképp mutat egy kicsit.

De a html-t akarja, js kimenete ugyanúgy html (hacsaknem canvasolok pl 😊, de mindegy, poénnak szántam a beírását, le lett beszélve. 😊

@MerlinW: A módosítások paramétereit küldöd át php-nek, ami megcsinálja ugyanazt a saját libreryjével.

Ezt nézegettem én is, de nem jöttem rá, hogyan menthetném el a módosított képet.

írd meg javascripttel az egészet, és tegyél rá packert aki abból lop annak meg egészségére. vagy csinálj tiszta flash oldalt a flat nem kapja meg akkor megint nyert ügyed van.

Köszi a válaszokat, még rágódom rajta egy darabig 😛

küldd máshoz 😊

Mit kezdjek olyan valakivel, aki egy compilert szeretne ráereszteni a honlapjára, hogy a "html kódját ne lopják el"? <#idiota>

talán még a html5 canvas. de lószart sem konyítok hozzá

forgatni, nagyítani, kivágni:
http://www.gastonrobledo.com.ar/cropzoom/index2.html

dragdrophoz jó a jquery ui

effektezni meg http://www.pixastic.com/lib/, bár elmenteni gondolom php-vel kell, szóval akár azt lehet ajaxozni is

Flash alapokra érdemes fektetni, csak meg kell írni rendesen.

js imagemagick nagyon lassan fog menni még jó nettel is nagy felbontásnál, jQuery nen erre van kitalálva. Javascripttel megoldható de rengeteg meló és felkötöd magad amire elkészül.

pl http://www.sumopaint.com/app
erre a flash a nyerõ. max a java.

Kaptam egy új feladatot.

Webes albumszerkesztõt kell csinálnom amiben a képeket összevissza lehet majd húzgálni, forgatni, méretezni, effektezni egy adott felületen.

Eddig flashben oldották meg, de elégedetlenek vele mert rosszul kezeli a magas felbontású képeket és tele is szemeteli a memóriát.

Van ötlete valakinek milyen alapokra kellene építeni a rendszert? jQuery, js, php imagemagik kombóval ez mennyire lenne stabil? Fontos lenne hogy crossbrowser legyen.

Ebbõl kiindulva nem tûnik reménytelennek a dolog.

Kézifék nem nagyon megy szegényen, de cool 😄

Safari 10.6+

he?😄

Nem semmi: http://helloracer.com/webgl/

de hülye vagyok.. akkor az átmenet és megoldva... 😊

Jól értem, hogy ebbõl a box-shadow dologból nincs olyan, hogy csak bottom?

Kezd összeállni a kép.. no nem azért, mert 3 napja ezt nézem, csak a nagy kódolást megszakítottam egy kis vizsgával. 😊 Köszönöm szépen, ez nagyon jó! 😊

Igazad van, én voltam a hülye, a button valójában speciális display-el rendelkezik, csak inline-nak jelzi a butája. 😊

Megoldás lehet az inline-block.
Tehát ezzel egészítsd ki:

display: inline-block;
zoom: 1;
*display: inline;

Igaz a validitás ugrik, vagy tedd az utolsó kettõt egy ie conditional css-be.

Ja és egy margin: 1;-et is lehet érdemes, mivel az outline az nem foglal helyet.

http://pastebin.com/KADakFry

nem button, a tag

Add a példát ahhol elõjön, mert alapból nem kéne neki és nem a "display: inline" tehet errõl önmagában, ugyanis amit linkeltem ott is inline (button user-agent alapján az)!
Vagy már amit linkeltem ott is így jelenik meg? Mert akkor vmi UA szinten beleturkál nálad (userchrome/addon).

4.0

Ilyen:


Ha display block vagy table, akkor jó, de nekem kell (kéne) hogy inline legyen.

FF hányas? Nálam semmi olyasmi nincs.

nálam ff alatt élesben van egy 1px #F7F7F6 sáv a gomb alján

Lehet w3c-nek nem így kellett volna megfogalmazni:
"The outline may be drawn starting just outside the border edge."
Ms ha talál kis kibúvót, akkor kihasználja, csakhogy õ máshogy mûködjön! 😊

@Lazarus: Ja kis csak css dolog, bár én nem igazán vettem észre, hogy emiatt gyorsabb lenne mint pl JSFiddle, vagy JSBin. 😊

"IE8 és IE9 pedig a borderen belülre rakja"

De laza.. 😄

Úgy érzem ennek az editornak még hasznát veszem, thx 😊

IE alatt egyáltalán nem jó, IE7 és kissebb nem jeleníti meg, IE8 és IE9 pedig a borderen belülre rakja.

Egyébként ugyanezt akartam én is linkelni, azért itt van. @CSSDeck 😊

Lehetne még box-shadow-al is megcsinálni, de az opera miatt is para, úgyhogy inkább outline.

Ja félre értettem, igen szélesebb lesz

IE9 alatt is érdekes a színátmenet :|

a border után rendereli. De úgy tudom IE8 alatt nem fog megjelenni.

hm..
gondolom ez az outline már a width:100px szélességen kívülre kerül.. jól gondolom?
//nem, még nem teszteltem.. csak tippelek 😊

és tényleg, átírtam😊

border: 3px solid orange;
outline: 3px solid green;

máshogy nem lehet a duple border miatt

Hm.. mondjuk így is két elem. De azért köszönöm szépen! <#eljen>
// Könnyen lehet, hogy ez lesz a nyerõ. 😊