- Xiaomi 13 Pro - szerencsés szám
- Apple iPhone 16 Pro - rutinvizsga
- Xiaomi 13T és 13T Pro - nincs tétlenkedés
- Magisk
- Honor 400 Pro - gép a képben
- Milyen okostelefont vegyek?
- Xiaomi 15 - kicsi telefon nagy energiával
- Az Oppo Find X8 Ultra lett a legvékonyabb kameramobil
- Honor 200 - kétszázért pont jó lenne
- Apple Watch Ultra - első nekifutás
Új hozzászólás Aktív témák
-
martonx
veterán
válasz
huliganboy #5851 üzenetére
Kcsit érthetőbben, mi a probléma?
-
huliganboy
addikt
válasz
huliganboy #5850 üzenetére
-
huliganboy
addikt
válasz
huliganboy #5849 üzenetére
Sziasztok!
A középre helyezés tökéletes...
Most próbálom a részletek gombra való kattintást követően nagy kép megjelenítést amit a gépemen meg is oldottam... Viszont szerverre felmásolva nem akar működni de érzésem szerint átlinkeltem mindent (vagy nem?)
fancyboxLényegében így néz ki a html fájl:
<!DOCTYPE html>
<html lang="hu">
<head>
<title>2014 ŐSZI KERET</title>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Original Hover Effects with CSS3" />
<meta name="keywords" content="css3, transitions, thumbnail, animation, hover, effect, description, caption" />
<meta name="author" content="Alessio Atzeni for Codrops" />
<link rel="shortcut icon" href="../favicon.ico">
<link rel="stylesheet" type="text/css" href="http://kisvardafc.hu/joomla/images/hover/css/demo.css" />
<link rel="stylesheet" type="text/css" href="http://kisvardafc.hu/joomla/images/hover/css/style_common.css" />
<link rel="stylesheet" type="text/css" href="http://kisvardafc.hu/joomla/images/hover/css/style1.css" />
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<link rel="stylesheet" href="http://kisvardafc.hu/joomla/images/hover/js/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="http://kisvardafc.hu/joomla/images/hover/js/source/jquery.fancybox.pack.js?v=2.1.5"></script>
<script type="http://kisvardafc.hu/joomla/images/hover/text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
</script>
</head>
<body>
<div class="container">
<div class="header">
</div>
<h1>2014 ŐSZI KERET<span>Kisvárda Master Good</span></h1>
<center><img src="http://kisvardafc.hu/joomla/images/hover/images/DSCF8032.JPG"/></center>
<center>Felső sor<br>
Középső sor<br></span>
Alsó sor</center></h1>
<div class="main">
<h1><span>Szakmai stáb</span></h1>
<div class="view view-first">
<img src="http://kisvardafc.hu/joomla/images/hover/images/2.jpg" class="csapat_img_fix ">
Dr. Sipos István
<div class="mask">
<h2>Dr. Sipos István</h2>
<p>Klub Igazgató</p>
<a class="fancybox info" rel="group" href="http://kisvardafc.hu/joomla/images/hover/nagy/myke.png">Részletek</a>
</div>
</div>
<div class="view view-first">
<img src="http://kisvardafc.hu/joomla/images/hover/images/2.jpg" class="csapat_img_fix ">
Dr. Sipos István
<div class="mask">
<h2>Dr. Sipos István</h2>
<p>Klub Igazgató</p>
<a class="fancybox info" rel="group" href="http://kisvardafc.hu/joomla/images/hover/nagy/myke.png">Részletek</a>
</div>
</div>
</body>
</html>Én erre gondolok hogy nem stimmel, de nem tudom hogy kell helyesen belinkelni:
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});Ránézne valaki?
Köszönöm
-
wis
tag
válasz
huliganboy #5842 üzenetére
Nem kell új class, egyszerűen írd felül:
.dd-article img {
margin: 0;
}A style_common.css később töltődik be így az fog érvényesülni.
Szerk:
Most látom két <html> van egy oldalban, ezzel még sok melód lesz... -
DNReNTi
őstag
válasz
huliganboy #5842 üzenetére
Azért mert a template.css továbbra is felülírja :/
-
DNReNTi
őstag
válasz
huliganboy #5838 üzenetére
Nem bonyolult.
Egyszerűen létrehozol egy osztályt egy új vagy valamelyik ccs fájlban mondjuk így:
.csapat_img_fix {
margin: 0;
}Ez összesen annyit csinál, hogy a margót nullázza, elég is pont erre van szükséged. Ha ez megvan akkor pedig a megfelelő fáljban vagy bejegyzésben (ahonnan ez az oldal jön) a .view .view-first osztályokkal rendelkező divben lévő képre alkalmazod ezt az új osztályt.
Pl ezt fogod kapni:
<img src="http://kisvardafc.hu/joomla/images/hover/images/2.jpg" class="csapat_img_fix ">Így már jó lesz.
Javítson ki valaki ha tévedek, sajnos (szerencsére) a Jooma eddig elkerült pályafutásom során.Az ilyen fix-ekre amúgy célszerű bevezetni szerintem egy új css fájlt, amiben csak az ilyen felülvágások lesznek, mert nem ez lesz az utolsó. Persze azt meg akkor be kell húzni minden oldalra a meglévő kb 20 mellé.
Ja meg használj a képekre alt attribútumot mer' így nem HTML5 valid.
-
DNReNTi
őstag
válasz
huliganboy #5835 üzenetére
Ahogy mondtam, a konténerben lévő img elem örököl margin tulajdonságot, emiatt csúszik el. Na most mivel ez máshol is használva van, én bevezetnék ezekre egy új css osztályt amit csak ezekre alkalmazok, így elkerülhető, hogy máshol elússzon ha átírod.
Az ingyenes tartalomkezelők szépsége
Szuper míg nem kell hozzányúlni.
-
huliganboy
addikt
válasz
huliganboy #5835 üzenetére
a témának a css bekavar a beállításokba... Valahogy lehet ignorálni vagy az kihat az egész oldalra?
-
DNReNTi
őstag
válasz
huliganboy #5833 üzenetére
Ha be tudnád linkelni a joomla oldalt könnyebb lenne segíteni, egyébként valószínű, hogy a konténer vagy a kép örököl css szabályokat a joomla-tól, és ezért csúszik el. Ilyenekre gondolok pl:
- A konténer padding tulajdonságot örököl.
- A kép margin és/vagy padding tulajdonságot örököl.
- A betűtípus pedig egyértelmű, valahonnan megörököl egy másik beállítást.Ezt a legkönnyebb kinyomozni a Developer Tools-al (F12) lehet, kiválasztod a vizsgálni kívánt elemet és láthatod mely css szabályok vannak rá vonatkoztatva és melyik honnan érkezik, melyik melyiket vágja felül.
-
pecze
aktív tag
válasz
huliganboy #5804 üzenetére
A képre vonatkozó stílusbeállítás a style_common.css-ben van, ott a .view class-ban kell módosítani a margin értékét, hogy közelebb hozd egymáshoz őket, csökkenteni kell.
Ezenkívül van bal, jobb, alsó, felső margó, ha egy értéket adsz meg, a margin mindre vonatkozik, ha nem akarod, csak a bal, jobb margót módosítani, vagy eltérő értékeket akarsz megadni, akkor megadhatod egyesével is:
margin: 20px 10px 20px 10px;
Sorrend: felső, jobb, alsó, bal
vagy
margin: 20px 10px;
Sorrend: felső és alsó, bal és jobbEkkor már közelebb kerülnek egymáshoz, csak van egy divszélesség megadva a .main classban (demo.css): 680px.
Ki van kalkulálva, hogy a két kép szélessége, plusz a bal és jobb margók, plusz a border (képek kerete) mennyi helyet foglalnak el, ezt az értéket kell módosítani a margóból levett értékkel és akkor vissza kerülnek középre.
Pl. 10-es bal és jobb margóval az érték 200-al csökken: 60-10 = 50 és négy margó van.Felugró képekre meg itt egy példa, minden le van írva, mit hova kell beilleszteni:
http://fancyapps.com/fancybox/ -
Sk8erPeter
nagyúr
válasz
huliganboy #5570 üzenetére
Ahogy DNReNTi mondta, felejtsd el a Flash-t, ez nem csak mobil esetén igaz, hanem úgy általában, például biztos van rajtam kívül más is, aki alapértelmezetten tiltja az oldalakon lévő Flash-tartalmakat akár extensionnel, akár olyan módon, hogy "Click to play"-alapon jelenjenek meg, amúgy meg csak egy szürke felület látszik a helyén.
(#5572) biker :
A másik fele házi feladat ("hogyan használjuk a Google-t, valamint a Google Maps API igen bőbeszédű és példákkal teli dokumentációjának értelmezéséhez az eszünket"-feladat).
Őszintén reméltem, hogy ez nem fog már problémát okozni, de hát... -
DNReNTi
őstag
válasz
huliganboy #5570 üzenetére
Az <object> elemen belül helyezhetsz el linket, ami akkor látszik ha nincs Flash Player. Így a legegyszerűbb. A legjobb meg talán az ha lassan elfelejted a Flash-t.
Új hozzászólás Aktív témák
Hirdetés
- AKCIÓ! GAMER PC: Új RYZEN 5 4500-5600X +RTX 3060/3070/3080 +Új 16-64GB DDR4! GAR/SZÁMLA! 50 FÉLE HÁZ
- UHH! HP EliteBook 840 G8 Fémházas Laptop 14" -45% i5-1145G7 4Mag 32/512 FHD IPS Intel Iris Xe Magyar
- Xiaomi Redmi Note 13 Pro 5G - 8/256 - Media Markt garancia
- Xiaomi Redmi 9at - 2/32 - szürke
- Xiaomi Mi8 - 6/128 - fekete
- AKCIÓ! VALVE INDEX virtuális valóság szemüveg garanciával hibátlan működéssel
- Iphone 16E 128GB Fekete Bontatlan 24 Hónap Garancia
- BESZÁMÍTÁS! Apple MacBook Pro 14 M2 Pro - M2 Pro 16GB 512GB SSD garanciával hibátlan működéssel
- Bomba ár! HP ZBook 15 Studio G3 - Intel Xeon I 32GB I 512SSD I 15,6" FHD I Nvidia I Cam I W10 I Gar
- Bomba ár! Lenovo ThinkPad X250 - i5-5GEN I 8GB I 128GB SSD I 12,5" HD I Cam I W10 I Garancia!
Állásajánlatok
Cég: Promenade Publishing House Kft.
Város: Budapest
Cég: PC Trade Systems Kft.
Város: Szeged