0

ページ遷移が 1 回しか機能しない (その後アニメーションが実行されない) のはなぜですか? 関数を変更してこれを機能させる方法を誰かに教えてもらえますside(el)か?

これは私のJavaScriptです:

function fall(el) {
        var elem = document.getElementById(el);
        elem.style.transition = "left 0.5s ease-in 0s";
        elem.style.left = "0px";

        document.getElementById('product').style.height="0px";
        document.getElementById('activity').style.opacity=0;


        document.getElementById('home').style.visibility="visible";
        document.getElementById('product').style.visibility="hidden";
        document.getElementById('activity').style.visibility="hidden";
        document.getElementById('work').style.visibility="hidden";
        document.getElementById('about').style.visibility="hidden";
}

function rotate(el) {
        var elem =document.getElementById(el);
        elem.style.transition = "height 0.5s linear 0s";
        elem.style.height = "100%";

        document.getElementById('home').style.transition = "left .5s ease-out 0s";
        document.getElementById('home').style.left = "-3500px";
        document.getElementById('activity').style.opacity=0;



        document.getElementById('home').style.visibility="hidden";
        document.getElementById('product').style.visibility="visible";
        document.getElementById('activity').style.visibility="hidden";
        document.getElementById('work').style.visibility="hidden";
        document.getElementById('about').style.visibility="hidden";
        }

function flip(el) {
        var elem =document.getElementById(el);
        elem.style.transition = "opacity 0.5s linear 0s";
        elem.style.opacity = 1;

        document.getElementById('product').style.height="0px";
        document.getElementById('home').style.left = "-3500px";


        document.getElementById('home').style.visibility="hidden";
        document.getElementById('product').style.visibility="hidden";
        document.getElementById('activity').style.visibility="visible";
        document.getElementById('work').style.visibility="hidden";
        document.getElementById('about').style.visibility="hidden";}

function cube(el) {
        var elem =document.getElementById(el);
        elem.style.transition = "right 0.5s ease-in-out 0s";
        elem.style.right = "0px";

        document.getElementById('home').style.left = "-3500px";
        document.getElementById('activity').style.opacity=0;
        document.getElementById('product').style.height="0px";

        document.getElementById('home').style.visibility="hidden";
        document.getElementById('product').style.visibility="hidden";
        document.getElementById('activity').style.visibility="hidden";
        document.getElementById('work').style.visibility="visible";
        document.getElementById('about').style.visibility="hidden";
}

function side(el) {
        var elem = document.getElementById(el);
        document.getElementById('about').className ="pt-page-ontop pt-page-rotateInNewspaper pt-page";


        document.getElementById('home').style.left = "-3500px";
        document.getElementById('activity').style.opacity=0;
        document.getElementById('product').style.height="0px";

        document.getElementById('home').style.visibility="hidden";
        document.getElementById('product').style.visibility="hidden";
        document.getElementById('activity').style.visibility="hidden";
        document.getElementById('work').style.visibility="hidden";
        document.getElementById('about').style.visibility="visible";
}
4

0 に答える 0