Я новичок в этом мире кодирования. Мои знания HTML и CSS минимальны и несущественны, когда дело доходит до Javascript.Префиксы поставщиков для javascript
Я работаю над проектом, для которого мне нужно создать сайт параллакса, и каждый раздел разделен по диагонали. Бит параллакса почти закончен, но я изо всех сил стараюсь, чтобы диагонали функционировали в разных браузерах. Используя немного кода, который кто-то еще добавил в этот форум, я должен был сделать это для Firefox, но все равно нужно заставить его работать с другими браузерами или, по крайней мере, с Chrome и Safari. Может ли кто-нибудь помочь?
HTML
<div>
<section><a href="#1"></a></section>
<section><a href="#2"></a></section>
</div>
CSS
html, body, div{ height: 100%; width: 100%; padding: 0; margin: 0; }
div { overflow : hidden; position: relative; }
section {
height : 500%;
background : red;
width : 500%;
position : absolute;
top : -100%;
-moz-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
-o-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
}
section + section {
background: #333;
top : 80%;
-moz-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
-o-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
}
section a { display: block; width: 100%; height: 100%; cursor: pointer; }
JS
$(function() {
$(window).on('resize', function() {
var h = $(document).height(),
w = $(document).width();
var angle = ((Math.atan(h/w) * 10.29577951308232));
$('section').css("-moz-transform", "rotate(" + angle + "deg)")
})
.triggerHandler('resize');
});
Вы только с таргетингом на Мос свойство преобразования? Я предполагаю, что если вы измените moz на WebKit, он будет работать в хроме? – leaksterrr
jQuery 1.8+ автоматически добавляет префиксы поставщиков. –
Leaksterr, я пробовал это, но все еще не делаю этого ... –