Bagaimana Anda menyelaraskan tayangan slide dalam html?

Saat ini bekerja dengan Anything Slider untuk WordPress dan menyukainya sejauh ini. Mengalami masalah berpikir;

Saya ingin penuh dengan slider. Membuat DIV induk (height. 400px; . 100%) dan aktifkan opsi Perluas sehingga sesuai dengan lebar inti halaman. Juga setel Ubah Ukuran ke true karena saya mengalami masalah saat mengubah ukuran browser dari kecil ke besar, penggeser juga tidak akan bertambah. Jadi saya dibiarkan dengan celah besar

Masalahnya adalah gambar yang saya gunakan di slide tidak rata tengah. Sepertinya menempel di kiri dan saya tidak tahu bagaimana mengubahnya. Bahkan mencoba memusatkan (margin. 0 otomatis;) A dalam. Div konten di penggeser tetapi tidak berhasil

Ada ide?

10 Februari 2012 pukul 6. 37 pagi

Mottie

Anggota

Apakah Anda ingin gambar melebar di dalam penggeser?

Untuk membuat gambar mengisi slider, setel opsi "resizeContents" ke true

Untuk memusatkan gambar, coba gunakan ________3______ sebagai ganti margin

10 Februari 2012 pukul 7. 00 pagi

XaviJr

Peserta

Periksa apakah div yang Anda coba pusatkan memiliki tampilan. memblokir

12 Februari 2012 pukul 5. 04 sore

Pino

Anggota

Terima kasih atas sarannya, tapi sejauh ini tidak berhasil

Div Induk yang menahan penggeser memiliki tampilan. memblokir dan mengganti margin. 0 otomatis pada A. Div konten dengan perataan teks. tengah; . Gambar di penggeser tetap menempel di kiri dan saat mengubah ukuran browser, gambar tidak akan tetap berada di tengah. Ada saran lain?

EDIT

Biarkan saya mengklarifikasi hanya untuk memastikan. Idenya adalah memiliki penggeser di halaman depan dan harus penuh. Saya menggunakan gambar (lebar 1900px) sehingga ketika orang dengan resolusi layar lebih besar dapat melihat intire slide. Orang yang memiliki layar lebih kecil tidak melihat seluruh slide. Gambar dalam slide itu sendiri tidak harus diubah ukurannya. Itu hanya perlu menyelaraskan terpusat, itu saja. . )

13 Februari 2012 pukul 3. 55 sore

Pino

Anggota

*MENABRAK*

Siapa pun?

Terima kasih banyak atas waktunya

14 Februari 2012 pukul 8. 56 sore

Mottie

Anggota

Hai Pino

Moving Boxes tidak benar-benar berfungsi seperti itu. Anda mungkin akhirnya memerlukan skrip khusus untuk melakukan apa yang Anda gambarkan karena saya tidak dapat memikirkan penggeser mana pun yang akan melakukan itu

18 Februari 2012 pukul 7. 45 pagi

Pino

Anggota

Terima kasih untuk Replay Mottie. Tapi ini bukan tentang MovingBoxes tapi tentang AnythingSlider. Apakah mungkin dengan slider itu?

18 Februari 2012 pukul 10. 35 pagi

Mottie

Anggota

Derp

Maaf, saya telah mencoba untuk mengejar semua email saya dan saya kira saya benar-benar melamun yang satu ini LOL. Bagaimanapun, ya itu mungkin… tambahkan saja gambar sebagai latar belakang tengah. Ini adalah demo (ubah ukuran jendela hasil untuk melihatnya berfungsi), dan kodenya

HTML








CSS

#wrapper {
width: 100%;
height: 300px;
}
#slider .panel1 { background: url(http://placekitten.com/800/300) no-repeat center center; }
#slider .panel2 { background: url(http://placehold.it/800x300) no-repeat center center; }
#slider .panel3 { background: url(http://placedog.com/800/300) no-repeat center center; }
#slider .panel4 { background: url(http://dummyimage.com/800x300/000/fff.jpg) no-repeat center center; }
_

Naskah

$(function(){
$('#slider').anythingSlider({
// If true, the entire slider will expand to fit the parent element
expand: true
});
});​

5 Maret 2012 pukul 9. 45 pagi

Pino

Anggota

Halo Motte,

Pertama, terima kasih atas tanggapan Anda. Maaf atas reaksi yang terlambat, saya telah pergi selama beberapa minggu

Apakah ini mungkin dengan plugin WordPress Anythingslider?

Gambar ini tidak dirender melalui css tetapi dengan plugin jadi saya tidak bisa menggunakan solusi "pusat pusat latar belakang" di CSS

Ada pemikiran?

5 Maret 2012 pukul 7. 48 sore

Mottie

Anggota

Anda mungkin harus bertanya kepada Jacob tentang hal ini di forum WordPress… tetapi, saya tidak mengerti mengapa Anda tidak dapat menambahkan slide kosong, lalu tambahkan saja css di suatu tempat di halaman Anda. Meskipun Anda mungkin harus menargetkan panel dengan css menggunakan nth-child atau sesuatu

9 Juli 2012 pukul 3. 24 sore

tgstig

Anggota

Halo Pino,

Saya juga punya masalah yang sama, bagaimana Anda memperbaikinya?

Saya juga ingin memusatkan gambar di dalam penggeser, karena ketika ukuran layar menjadi lebih kecil, gambar diposisikan di sebelah kiri dan separuh gambar tidak terlihat

Jika Anda memiliki gambar 1900px tetapi layarnya 1200px, 700px dari sisi kanan tidak akan terlihat

Saya harap ada solusi untuk ini

4 Juli 2013 pukul 11. 01 siang

aximili

Peserta

Ini solusinya

http. //stackoverflow. com/questions/17480370/anythingslider-centre-images-even-on-low-screen-resolution/17480484

Bagaimana cara menyelaraskan tayangan slide dalam HTML?

Anda harus memastikan. div slides_container dipusatkan di dalam induknya , i. e. Jika itu tidak berhasil, Anda perlu memastikan penampung induk memiliki lebar 100% dari halaman. Jika itu tidak berhasil, Anda perlu memastikan induknya 100% lebar halaman.

Bagaimana Anda menyelaraskan tayangan slide?

Sejajarkan objek . Rata Kiri, Rata Tengah, atau Rata Kanan. Rata Atas, Rata Tengah, atau Rata Bawah. Distribusikan Secara Horizontal atau Distribusikan Secara Vertikal. Select Picture format > Align and select how you want to align them: Align Left, Align Center, or Align Right. Align Top, Align Middle, or Align Bottom. Distribute Horizontally or Distribute Vertically.

Bagaimana cara memusatkan penggeser gambar?

Apakah Anda ingin gambar diperluas di dalam penggeser? . Untuk memusatkan gambar, coba menggunakan perataan teks. tengah; . .

Bagaimana Anda menyelaraskan gambar dalam HTML?

Kami menggunakan align attribute untuk menyelaraskan gambar. Ini adalah elemen sebaris. Nilai Atribut. kiri. Ini digunakan untuk menyelaraskan gambar ke kiri.