it-swarm-id.com

Transformasi CSS3: skala dalam IE

Saya ingin menggunakan properti transformasi CSS3: skala.

div
{
     transform: scale(0.5,0.5);
}

Apakah ada cara untuk meniru ini di Internet Explorer 8 dan lebih rendah? Mungkin ada sesuatu dengan filter atau solusi Javascript?

Saya telah mencari di web tanpa hasil.

Terima kasih banyak, Vincent

18
Vinzcent

IE9 mendukung transformasi:

-ms-transform: scale(0.5,0.5);

Untuk versi IE lainnya, ada sintaksis yang kompleks. Sesuatu seperti ini:

filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand',
    M11=1.5320888862379554, M12=-1.2855752193730787,
    M21=1.2855752193730796, M22=1.5320888862379558);

Lihat sini untuk info lebih lanjut.

33
Pedram Behroozi

Tidak, IE8 dan sebelumnya tidak mendukung gaya transform standar. IE9 mendukungnya.

Ada solusi yang bisa Anda coba gunakan gaya filter, tetapi mereka akan berantakan.

Tetapi untuk kasus sederhana yang Anda uraikan dalam pertanyaan (pada dasarnya penurunan sederhana), Anda bisa menggunakan properti zoom milik IE.

Karena ini bukan standar, penggunaan zoom yang paling umum adalah withzoom:1, yang digunakan untuk memperbaiki sejumlah gangguan tata letak IE (khususnya di IE6 dan IE7). Tapi itu juga melakukan pembesaran aktual, dan Anda dapat menggunakan zoom:0.5 untuk mencapai efek yang Anda cari.

Hal yang baik tentang penggunaan zoom adalah ia berfungsi di IE seperti properti CSS normal lainnya (alternatif filter memiliki beberapa kebiasaan render yang serius yang perlu Anda ketahui).

Satu-satunya kelemahan menggunakan zoom adalah Anda harus menonaktifkannya di IE9 atau yang lebih baru, jika tidak maka akan berinteraksi dengan gaya transform Anda dan memiliki beberapa efek yang tidak diinginkan. Saya bukan orang yang secara umum mendukung penggunaan peretasan CSS, tetapi Anda dapat menggunakan peretasan /9 ( didokumentasikan di sini ) untuk membuatnya hanya mempengaruhi IE8 dan sebelumnya, artinya Anda dapat menentukan transform dan zoom di stylesheet yang sama, seperti:

div {
  transform: scale(0.5,0.5);
  zoom: 0.5\9;
}

Kalau tidak, Anda harus menggunakan komentar bersyarat untuk menentukan apakah akan menggunakannya.

Jelas jika Anda ingin melakukan sesuatu yang lebih kompleks daripada skala proporsional sederhana, maka zoom tidak akan cocok, tetapi untuk kasus sederhana seperti yang ada di pertanyaan Anda, itu akan menjadi sempurna.

13
Spudley

http://msdn.Microsoft.com/en-us/library/ms533014(v=vs.85).aspx

meskipun, filter di IE tidak mudah digunakan dan tidak selalu dikombinasikan dengan efek css lainnya ....

tetapi IE 9 skala dukungan https://developer.mozilla.org/en/CSS/transform

1
4esn0k
0
Asinox