Как я могу исправить положение изображения в js или css? У меня есть колесо обозрения. Я хочу, чтобы все мое изображение было в положении стоя при вращении. - PullRequest
Новая
       8

Как я могу исправить положение изображения в js или css? У меня есть колесо обозрения. Я хочу, чтобы все мое изображение было в положении стоя при вращении.

0 голосов
/ 15 сентября 2011

Как я могу исправить положение изображения в js или css? У меня есть колесо обозрения. Я хочу, чтобы все мое изображение было в положении стоя при вращении. Я хочу быть таким: http://jsdo.it/proppy/plUk/fullscreen см. Розовый треугольник. Положение фиксируется при вращении.

вот мой: http://letmespeakenglish.net/wheel/index.html

Любая помощь? Любые предложения приветствуются. Спасибо за вашу помощь.

Ответы [ 2 ]

1 голос
/ 15 сентября 2011

Вот рабочий пример

Хорошо, чтобы решить вашу проблему, вы должны повернуть в отдельности отдельные изображения, так как все колесо вращается.Таким образом, изменение вашего сценария должно исправить это: 

<script src="http://code.jquery.com/jquery-1.6.3.min.js" type="text/javascript"></script>  
<script>
    var rotation = 0
    setInterval(function() {
        $('div.#wheel').css({
            "-moz-transform": "rotate(" + rotation + "deg)",
            "-webkit-transform": "rotate(" + rotation + "deg)",
            "-o-transform": "rotate(" + rotation + "deg)",
            "-ms-transform": "rotate(" + rotation + "deg)"
        }); 

        $('.fa').css({
        "-moz-transform": "rotate("+(-rotation)+ "deg)",
        "-webkit-transform": "rotate("+(-rotation)+ " deg)",
        "-o-transform": "rotate("+(-rotation)+ " deg)",
        "-ms-transform": "rotate("+(-rotation)+ " deg)"
    }); 

    rotation = (rotation + 10) % 361
    }, 500);
</script>

Вы чувствуете тошноту, когда смотрите на него слишком долго.Я имею в виду колесо обозрения, а не код.

0 голосов
/ 15 сентября 2011

Не уверен, что это решит вашу проблему, но я вижу, что вы поворачиваете свои изображения каждые 500 мс: это большая задержка.Попробуйте с 50 мс. 

    var rotation = 0
setInterval(function() {
    $('div.#wheel').css({
        "-moz-transform": "rotate(" + rotation + "deg)",
        "-webkit-transform": "rotate(" + rotation + "deg)",
        "-o-transform": "rotate(" + rotation + "deg)",
        "-ms-transform": "rotate(" + rotation + "deg)"
    }); 

        $('.fa').css({
        "-moz-transform": "rotate(1 deg)",
        "-webkit-transform": "rotate(1 deg)",
        "-o-transform": "rotate(1 deg)",
        "-ms-transform": "rotate(1 deg)"
    }); 

 rotation = (rotation + 10) % 361
}, 50)
...