类问题的javascript语法

时间:2015-04-28 22:56:00

标签: javascript jquery html css

好的我有这个javascript ...

$(document).ready(function() {
    $('#holder').toggleClass("visible");

    $('a.link').click(function(event) {
        // Over-rides the link
        event.preventDefault();
        // Sets the new destination to the href of the link
        newLocation = this.href;
        color = $(this).data("color");
        $('body').css('background-color', color );
        $('#holder').css('opacity','0' );
        // Delays action
        window.setTimeout(function() {
            // Redirects to new destination
                window.location = newLocation;
        }, 250);
    });

    $('h1').click(function(event) {
        $('#holder').toggleClass("visible");
    });

});

我有这个HTML .......

<body class="landingpage">

    <h1 class="begining">Page Tansitions</h1>
    <p><a class="link" href="/one.html" data-color="#f36c20">Page One</a></p>
    <p><a class="link" href="/two.html" data-color="#edcd40">Page Two</a></p>

</body>

......这一切都很精致和花花公子,js做了它的事情,并改变了页面的颜色,这是参考&#39; body&#39;在上面的代码....

我不想改变身体&#39;一个html页面的标签我想改变一个像.metro .tile-area-darkCrimson这样的类在我的CSS和我的html中引用...我不能为我的生活找出如何呈现它在javascript中可以有人请求帮助。

干杯, 格雷格。

....除此之外,我试图将它整合到一个现在似乎无法工作的更复杂的结构中...我有html的链接,我正在使用一个tile类和动画做没有任何改变的工作......

<a class="tile double bg-tile1color live animated flipInX link" data-color="#f36c20" data-role="live-tile" data-effect="slideUp" data-click="transform">

当用户点击这个磁贴时,我也在使用javascript触发器,这就是我想在上述改变页面颜色的javascript中插入的地方..我猜javascript正在覆盖过渡.... / p>

<script>          
$('.tile').on('click', function () {

    $(".tile").addClass("flipOutX");
    setTimeout(function(){
        $(".tile-group.main").css({ marginLeft:"-40px", width: "1080px"}).load("musability-musictherapy-company-overview.html");
    }, 2000);

});
</script> 

2 个答案:

答案 0 :(得分:1)

您可以使用jQuery&#39; addClass

$('body').addClass('metro tile-area-darkCrimson');

答案 1 :(得分:1)

使用jquery,您可以使用完整的CSS选择方法

$('body').css('background-color', color );

可以是这样的

$('.metro .tile-area-darkCrimson').css('background-color', color );