好的我有这个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>
答案 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 );