Új hozzászólás Aktív témák

• #2548 Chrystall senior tag martonx #2543

  Új Válasz 2021-02-15 00:59:05 #2548

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2543 üzenetére

  Megtaláltam már, arra kell rákeresni, hogy hogy lehet elérni hogy aktív maradjon a gomb. Van jópár ilyen cikk.

• #2542 Chrystall senior tag

  Új Válasz 2021-02-14 15:39:05 #2542

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  Olyan menügombokat milyen címszóval kell neten keresni, amiknél ha lenyomom a gombot, miután betöltődik az oldal, a menüben annak az oldalnak a gombja lenyomva marad? Valamilyen animált gomb, de ezzel a funkcióval készülőknek mi a neve?

• #2540 Chrystall senior tag martonx #2539

  Új Válasz 2021-01-19 12:09:22 #2540

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2539 üzenetére

  Lesz majd valami poszt, csak jussak el addig.

  Köszi neked is a segítséget.

• #2538 Chrystall senior tag martonx #2536

  Új Válasz 2021-01-19 00:29:17 #2538

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2536 üzenetére

  Na, csak megszültem a tökéletes, precíz megoldást a gomb méreteken és képernyőkön átívelő megjelenítésére:

  https://codepen.io/bencuri/pen/XWjOooX

  A ::before checked-hez nem kell az a content pötty meg a méretezés. Csak background, meg belső box-shadow.

  Azért arra kíváncsi lennék, hogy miért allergiásak a content property méreteire a mobileszközök, de végülis mostmár ez indifferens.

  A vicc amúgy, hogy számos CSS oldal foglalkozik ilyen gombok kreálásával, és a legtöbbnél amit találtam, ott az okoskodás meg a szövegelés, a végén a kód, és voálá, mobilon ugyanúgy a pötty kilóg szélre és kicsi. Tehát úgylátom sokan nem nagyon vették ezt a hibát még észre. Egy értelmes megoldást láttam, amikor radial-gradient-tel kreál a gombba pöttyöt, az mobilon precíz, viszont az meg desktopon csálé kissé. A méret egyezik, de kissé csálé. De vészmegoldásként még tűrhető.

• #2537 Chrystall senior tag martonx #2536

  Új Válasz 2021-01-18 18:55:43 #2537

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2536 üzenetére

  Ezen felesleges most vitatkozni, hogy a honlap stílusának most úgy általanosságban véve milyen a kialakítása. Ez egy régebbi lapom, eddig minden ment rajta flottul, semmi okom nem volt azt gondolni, hogy pont a gombokkal volna majd baj, vagy egyáltalán bármivel, ugyanis elég egyszerű és amúgy problémamentes lap. Másrészről meg eddig is volt egy űrlap rajta, 123webforms-tól, amin a radio gombok méreteződnek rendesen. Úgyhogy valahogy meg lehet ezt oldani, csak annak a kódját eddig nem bogarásztam, mert az meg végképp egy óriási ezerféle gombopciót felölelő katyvasz. De ezek szerint muszály lesz belerágnom magam, mert ennek a honlapnak a kialakításával jelenleg maximálisan elégedett vagyok, esztétikus, ráadásul ez a fajta design ami nekem van, nagyon idétlen lenne ha nem méreteződne. Persze, máshogy is megoldható lett volna, de csak a gombok miatt erről nem akarok lemondani, mert amúgy meg szuper az egész, és hiányozna.

• #2535 Chrystall senior tag martonx #2534

  Új Válasz 2021-01-17 23:25:58 #2535

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2534 üzenetére

  De én meg említettem, hogy az a baj, hogy a honlapom stílusa olyan, hogy a méretek nem fixek hanem relatívak nagy monitoron. Így nem lehet a Stock gombokat használni, mert a Firefox a stock gombot nem engedi méretezni. Mondjuk most beugrott, hogy akkor mobilra egy külön divből a stock gombok jelennének meg, amíg a teáltalad adott kód rejtve lenne, de ez se igazán jó, mert a viewport eltérések miatt van, hogy a stock gombok mivel nem méretezhetők, túl kicsik egyes mobilokon. Határeset, de ott is kéne a méretezés. Ez egy szép honlap, jó megoldás kellene, nem felemás.

  Minden esetre vészmegoldásként max annyit tudok csinálni, hogy hagyom a pöttyöt hogy kitöltse a gombot, és akkor gond megoldva. De egyrészt nem igaz hogy egy szaros méretezhető gombot nem lehet a 21. században csinálni, a másik meg hogy amúgy van egy űrlapom amin jól méreteződik a gomb, majd arról kimásolom és adaptálom a kódot, csak az is ilyen third party űrlap egy tonna kóddal, valahol benne krikszkraksz idevágó részekkel, szóval kihámozni mindent egy év. A tied egyszerűbb meg elegánsabb lenne, csak ez a content dolog, ez kiakaszt.Meg nem is értem miért csinálja ezt a mobil, mikor az emulátorban jó, és így természetesen rá se tudok jönni mi a hiba, mert az emulátorban nem derül ki semmi.

• #2533 Chrystall senior tag martonx #2527

  Új Válasz 2021-01-16 23:03:05 #2533

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2527 üzenetére

  A multkor segítettél nekem ezzel a kóddal:

  http://jsfiddle.net/v3f16xrL/

  Már tesztelgettem, és jónak tűnt, de mégis van vele gond. Windowsban Chromeban és Firefoxban jó, és ha ezekben a Vizsgálat funkcióval emulálom mobileszközre szintén jó. Viszont ha konkrétan igazi mobileszközön kipróbálom, nem jó. iPad-en, vagy Samsung Galaxy-n néztem. A gond: minden méreteződik és helyén van ahogy kell, kivéve a kék pötty a gombban. Annál a font-size-t és a line-height-ot figyelmen kívül hagyja a böngésző, és emiatt csálén áll. Valamilyen oknál fogva nagyobb értékeket kell neki beállítani, mint amit te megadtál, és úgy lesz jó. Hiába hogy gépen az emulátorban úgy áll majd csálén, a rendes eszközön nem. Ez azért fura, mert a többi elemhez nem kell nyúlni azokat méretezi ahogy az emulátorban is. Mitől lehet ez? Azért idegesítő, mert pl. régi BlackBerry OS böngészőjében meg nem kell hozzányulni, az méretezi a pöttyöt is rendesen az eredeti kódoddal, így ha átírom, akkor meg ott is rosszul lesz a pötty pozícionálva.

  Valami a content-ben szereplő ASCII kód értelmezésével lehet talán? Hogy ha megvan adva a content, akkor azt standard beállítás szerint kezeli, nem számít mit adsz meg stílusban rá?

  Valami tipped volna hogy lehet rákényszeríteni a mobileszközt, hogy normálisan kezelje azt a pöttyöt, mint a BlackBerry OS?

• #2530 Chrystall senior tag martonx #2529

  Új Válasz 2021-01-08 16:14:11 #2530

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2529 üzenetére

  Köszi!

  Bár a scale-t használva egyszerűbb lenne de mindegymár jó lesz így is.

• #2528 Chrystall senior tag martonx #2527

  Új Válasz 2021-01-08 13:12:22 #2528

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2527 üzenetére

  De ebben hogy tudom a kék pontnak a méretét növelni? Látom a 2022-es számmal generálódik a content paraméterben, de hogy lehet a méretét növelni?

• #2526 Chrystall senior tag martonx #2525

  Új Válasz 2021-01-06 23:12:40 #2526

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2525 üzenetére

  Semmi bajom nem lenne a natív radio gombokkal, ha Firefoxban méretezhető lenne. Pont azért van ez a szívás, mert nem lehet. Amúgy már rég túlennék a dolgon. A méretezhetőség az oldalam stílusa miatt meg fontos. Minden méreteződik, csak pont a radio gomb marad pici, ráadásul a rendelési oldalon, amiből a pénzem van. Nagy lábon lövés lenne úgyhagyni.

  A @media query nem értem hogy könnyítene a dolgomon. H azt akarom, hogy egy 4K-s és egy sima HD képernyőn is ugyanolyan arányban mérezetten a Scale, akkor pontosan ki kell számolni az értékét, nem lehet viewport értékekkel trükközni. Kell bele pontosan a szám, nincs mit tenni. Hiába írsz bele egy vw értéket nem működik vele.

• #2524 Chrystall senior tag martonx #2523

  Új Válasz 2021-01-06 18:46:59 #2524

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2523 üzenetére

  Csak azért van annyi kód a Codepen-en mert egy templateből van az SCSS, amiben többféle gombvariáció van, és mindnek ebben a stylesheet-ben van a kódja.

  Azért lenne jó a Scale, mert van a radio gombon belül az a kis pötty, ami akkor jelenik meg, ha egy gombra rákattintassz és aktív. Na, nekem nem sikerült kiokumlálni, hogy milyen arányban viszonyuljon a gomb méretéhez annak a mérete, úgy hogy mindig pont középen legyen ha méreteződik, és ne félre álljon, mert az idétlenül néz ki. A scale-lel biztos, hogy mindig tökéletes lesz.

  A méretváltozás a gombra pedig azért kell, mert olyan az oldalam, hogy akármilyen képernyőn nézed, ugyan úgy néz ki a weblap, ugyanakkorák az arányok, nincs reszponzivitás meg semmi. Méreteződik minden, nem fix semminek a mérete. Így a Scale-ben is mindig változnia kell mekkorára nagyítsa vagy kicsinyítse a gombot hogy az arányok meglegyenek. Ehhez kéne az aktuális ablakméretet beolvasni az SCSS-ben egy változóba "px" unitban, abból már utána ki tudom számoltatni pontosan azzal az aránnyal, amivel az én oldalam méreteződik mekkora legyen a Scale. Na ezt nem tudom hogy kell. Hogy javascriptbe egyáltalán SCSS változót hogy írsz bele, lehet-e egyáltalán. A "vw"-vel nem lehet megcsinálni, mert azt nem írhatom a Scale-be egyrészt, másrészt mivel semmilyen unit nem mehet a Scale-be csak szám, a strip-unit-on át kell futtatnom az értékeket, most az mondom hogy strip-unit(100vw), annak semmi értelme nem lesz, mert nem egy pixelérték lesz a végeredmény, hanem 100. Azzal semmit nem tudok kezdeni. Pixelbeni érték kell, amiből le lehet csapni, hogy px, aztán a kapott számmal már tudnék mahinálni és beírni a Scale-be. Szerintem más út nincs rá, hogy a megfelelő értéket ki tudd számolni a Scale-be. Tudom nyakatekert, de így tökéletes lenne. Viszont már én is unom úgyhogy lehet megoldom sima width meg height: xy vw méretezéssel a gombra, lehet kicsit csálé lesz de ott egye meg mostmár a fene.

• #2522 Chrystall senior tag martonx #2521

  Új Válasz 2021-01-06 10:57:32 #2522

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2521 üzenetére

  Az nem jó mert a Scale-hez nem lehet megadni unit-ot. Ha Radio Boxot akarok csinálni, csak a Scale-lel lehet egyszerűen méretezni az egész gombot.

  De eddig már eljutottam:

  @function strip-unit($num) {
@return $num / ($num * 0 + 1);
}

input, label {
$kepernyo:100vw;
$meret: strip-unit($kepernyo);
transform: scale($meret);}

  A calcot még nem írtam bele, de majd azt megcsinálom.
  Ebbe hogy lehetne megoldani, hogy a $kepernyo értéke az az ablak aktuális mérete legyen? Ne VH hanem px-ben? Hogy lehet az beolvasni?

• #2520 Chrystall senior tag martonx #2519

  Új Válasz 2021-01-06 09:46:15 #2520

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2519 üzenetére

  Igen ez nekem is eszembe jutott. Amit nem említettem, hogy olyan a weblap amibe menne a kód, hogy minden elem ami rajta szerepel calc-kal kapja meg a méretét, amit a képernyőméretből számol. Így viszont külön a margókra is most ezt be kell írogatnom. Azt hittem valahogy el lehet érni, hogy a Scale növelje a margót is egyúttal. De sebaj.

  Viszont volna még egy kérdésem. Ami a fent linkelt kódban szerepel scaling:

  input, label { transform: scale(x);

  annak is calcból jönne az értéke. Úgy, hogy: (calc(képernyőméret/1366px)). Ebből hogy tudom leszedni a px-et, hogy használhassam ezt a scale-hez?

• #2518 Chrystall senior tag martonx #2517

  Új Válasz 2021-01-06 08:59:26 #2518

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2517 üzenetére

  Érthető. Hát itt van akkor. Már most az előző problémára találtam megoldást, de hogy lehetne azt megcsinálni, hogy az input és label közötti margó is növekedjen ha Scale értéket állítok a kettőre? Az input meg label scaling a legalján található a CSS-ben:

  https://codepen.io/bencuri/pen/NWRMQxj

• #2516 Chrystall senior tag martonx #2515

  Új Válasz 2021-01-05 20:31:38 #2516

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  válasz martonx #2515 üzenetére

  Jól van de mit érek vele? Nem fogom tudni akkor se mi a jó megoldás.

• #2514 Chrystall senior tag

  Új Válasz 2021-01-05 19:59:51 #2514

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Chrystall

  senior tag

  Valakinek volna tippje hogy ebben hogy lehetne a radio gombokat és a mellettük levő szöveget középre zárni függőlegesen? Sehogy se sikerül akárhogy próbálom:

  <div class="valasztogomb">


<input type="radio" name="slider" id="slide2" checked="checked" data-href="paystandard.html">
<p style="display:inline-block;">Standard
</p>
<br/>
<input type="radio" name="slider" id="slide3" data-href="payregistered.html">
<p style="display:inline-block;">Registered
</p>
<br/>
<input type="radio" name="slider" id="slide4" data-href="paydownload.html">
<p style="display:inline-block;">Download
</p>
<br/>
<br/>

</div>

<div id="down_icon2"><a href="paymentstandard.html"><img src="files/theme/paypaybutton.png"></a></div>

Új hozzászólás Aktív témák