zrobić obraz (nie tła img) w div powtórzyć?

Question

Próbuję powtórzyć-y obraz, który jest w div i bez obrazu tła, ale nie zorientowali się, jak. Czy możesz wskazać mi rozwiązanie?

Mój kod wygląda następująco:

<div id="rightflower"> 
<img src="/image/layout/lotus-dreapta.png" style="repeat-y; width: 200px;"/> 
</div> 

Answer 1

Masz do wykorzystania jako style="background-repeat:repeat-y;width: 200px;"repeat-y zamiast style="repeat-y".

Spróbuj wewnątrz znacznika obrazu lub użyć poniższego css dla div

.div_backgrndimg 
{ 
    background-repeat: repeat-y; 
    background-image: url("/image/layout/lotus-dreapta.png"); 
    width:200px; 
} 

Answer 2

Nie z CSS nie można. Musisz użyć JS. Szybki przykład kopiowania pliku img na drugi plan:

var $el = document.getElementById('rightflower') 
    , $img = $el.getElementsByTagName('img')[0] 
    , src = $img.src 

$el.innerHTML = ""; 
$el.style.background = "url(" + src + ") repeat-y;" 

Lub możesz powtórzyć obraz, ale ile razy?

var $el = document.getElementById('rightflower') 
    , str = "" 
    , imgHTML = $el.innerHTML 
    , i, i2; 
for(i=0,i2=10; i<i2; i++){ 
    str += imgHTML; 
} 
$el.innerHTML = str; 

Answer 3

Prawdopodobnie byłoby łatwiej po prostu udawać za pomocą div. Po prostu upewnij się, że ustawiłeś wysokość, jeśli jest pusta, aby mogła się pojawić. Powiedzmy na przykład, że chcesz mieć wysokość 50 pikseli, ustaw wysokość div na 50 pikseli.

<div id="rightflower"> 
<div id="divImg"></div> 
</div> 

W swoim arkuszu stylów wystarczy dodać tło i jego właściwości, wysokość i szerokość oraz dowolne rozmieszczenie, które miałeś na myśli.

Answer 4

(DEMO)
Kody:

.backimage {width:99%; height:98%; position:absolute; background:transparent url("http://upload.wikimedia.org/wikipedia/commons/4/41/Brickwall_texture.jpg") repeat scroll 0% 0%; } 

i

<div> 
    <div class="backimage"></div> 
    YOUR OTHER CONTENTTT 
</div>