Umieszczanie obrazu zawsze na środku strony

Question

umieszczanie obrazu zawsze na stronie środkowej (ładowanie obrazu E.x dla wywołania ajax), nawet podczas przewijania ruchu. jak to jest?

Answer 1

Dla większości przeglądarek, można użyć position:fixed

img.centered { 
    position:fixed; 
    left: 50%; 
    top: 50%; 
    /* 
     if, for instance, the image is 64x64 pixels, 
     then "move" it half its width/height to the 
     top/left by using negative margins 
    */ 
    margin-left: -32px; 
    margin-top: -32px; 
} 

Jeśli obraz miał na przykład 40 x 30 pikseli, zamiast niego ustawiono margin-left:-20px; margin-top:-15px.

Oto jsfiddle przykład: http://jsfiddle.net/WnSnj/1/

Uwaga position: fixed nie działa dokładnie tak samo we wszystkich przeglądarkach (choć jest ok we wszystkich nowoczesnych struktur). Zobacz: http://www.quirksmode.org/css/position.html

Answer 2

To może pomóc: http://skfox.com/2008/04/28/jquery-example-ajax-activity-indicator/

Answer 3

umieścić obraz w tagu div z niektórych nazwę klasy (centeredImage) i kliknąć na poniższy css

div.centeredImage { 

    margin: 0px auto; 
    position: fixed; 
    top: 100px;//whatever you want to set top; 

} 

Answer 4

<style> 
.CenterScreen{ 
    position:fixed; 
    /*element can move on the screen (only screen, not page)*/ 

    left:50%;top:50%; 
    /*set the top left corner of the element on the center of the screen*/ 

    transform:translate(-50%,-50%);} 
    /*reposition element center with screen center*/ 

    z-index:10000; 
    /*actually, this number is the count of the elements of page plus 1 :)*/ 
    /*if you need that holds the element top of the others. */ 
</style> 

Jeśli dodać tej klasy elemencie, to będzie zawsze na środku ekranu.

Na przykład:

<a href="#" class="CenterScreen">Hello world</a>