ugrás a tartalomhoz

vízszintes scroll

aakosska · 2008. Május. 12. (H), 01.29
sziasztok
hogy oldható meg, hogy egymás mellé rakott 10 db képet (css: owerflow: scroll, display: block) stb. által ne függőlegesen, hanem vízszintesen scrollozza.
köszi
Ákos
‹ PSD-be kimentve html-t kimaradnak szavak Hogyan lehet eladni egy honlapot, amely HTML CSS alapú? ›
 ■
1

overflow-x ?

a.d.a.m · 2008. Május. 12. (H), 12.21
szia,

esetleg az overflow-x css tulajdonságot próbáltad már?

A témáról többet olvashatsz itt, példákat találsz itt. Sajnos ezek angol nyelvű oldalak, de ha rákeresel biztos lesz magyar leírás is.

a.d.a.m
2

ez az

aakosska · 2008. Május. 19. (H), 10.34
köszi szépen, ezt kerestem!!
3

mégse megy

aakosska · 2008. Május. 21. (Sze), 00.45
helló
ez az overflow-x, y szépen megcsinálja a kis dobozt, de sehogy sem tudom elérni, hogy a képek egymás mellett jelenjenek meg, hiába van ott a dobozka, ők megtörnek a sor végén, és új sort kezdenek, vagy egymás alá kerülnek
köszi
4

Így probáltad már?

Ustak · 2008. Május. 21. (Sze), 08.45
<div class="kulso">
<div class="belso">
<img src="1.jpg" /><img src="2.jpg"><...../>
</div>
</div>

.kulso {
position:relative;
width:(amennyi képet akarsz egyszerre láttatni +margin a képnek)px;
height: (amekkoraakepmagassag+bottom-top-margin-paddingja a kepnek +20px a scrollbarnak)px;
overflow:scroll;
padding:0;
text-align:center;
z-index:2 //ie miatt kell csunya ie!
}

.kulso .belso {
position:relative;
width:amennyi az osszeskeped hossza)px
z-index:1;
}

.kulso .belso img {
float:left;
}

Valami ilyesmi, tehát magyarul a külsö kisebb divbe van a belső nagyobb div, ami a képeket foglalja magába, mintha egy nagyobb déglalapot tologatnál a kisebb téglalap belsejében.
Remélem működik :-)
6

Sajnos nekem így nem műxik,

elchy · 2009. Jan. 26. (H), 01.14
Sajnos nekem így nem műxik, mindenképpen megtörik valamiért a sorvég. Amit hasonlót találtam imigyen néz ki:
<div class="textwidget">
<marquee direction="left" 
width="362" 
height="73" 
onmouseover="this.stop()" 
scrollamount="4" 
onmouseout="this.start()"  
align="left">
<img src="pic.jpg">
<img src="pic.jpg">
<img src="pic.jpg">
<img src="pic.jpg">
</marquee></div>
tudom nem egészen az ami a probléma mindenesetre hathatós alternatiíva
7

:?

fchris82 · 2009. Jan. 26. (H), 02.29
Én csináltam már ilyet. A megoldás pofon egyszerű:

ul#images {
	list-style: none;
	height: 165px;
	width: 600px;
	overflow-x: scroll;
	overflow-y: hide;
	white-space: nowrap;
}

ul#images li {
	display: inline;
	margin: 0 5px;
}
A HTML fájlt pedig így kell megcsinálni:

<ul id="images">
  <li><img src="vmi1.jpg" /></li>
  <li><img src="vmi2.jpg" /></li>
  ...
</ul>
Ha az oldalon nem csak egyetlen ilyen van, akkor érdemes ID helyett CLASSt használni.
5

nem korszeru?

toro · 2008. Május. 21. (Sze), 09.20
esetleg csendben kerdezem: table?

egyszeruen a kod nem hosszabb, viszont nem kell hozza irni 10 oldal css-t
nem kell mindig forditva ulni a lora