gpt4 book ai didi

javascript - 如何使用 jQuery CSS 方法传递媒体查询

转载 作者:行者123 更新时间:2023-11-28 17:47:45 65 4
gpt4 key购买 nike

我有一个像这样的媒体查询:

@media (min-width: 768px) {
.navbar-nav > li > a {
padding-top: 25px;
padding-bottom: 25px;
}
}

我需要像这样更改样式:

 $( "#heightSet" ).change(function() {
var choice = $(this).val();
if (choice == "50"){
$(".navbar-nav > li > a").css({"padding-top":"15px","padding-bottom":"15px"});
}
if (choice == "60"){
$(".navbar-nav > li > a").css({"padding-top":"20px","padding-bottom":"20px"});
}
});

我如何处理 .CSS() 上的 @media (min-width: 768px) 以便代码仅在该特定 View 端口上受到影响?

最佳答案

.my-class-15 {padding-top: 15px; padding-bottom: 15px;}
.my-class-20 {padding-top: 20px; padding-bottom: 20px;}

$("#heightSet").change(function () {
var choice = $(this).val();

if (choice == "50") {
$(".navbar-nav > li > a").addClass('my-class-15');
}
if (choice == "60") {
$(".navbar-nav > li > a").addClass('my-class-20');
}
});

这是一个 fiddle ,但如果没有您的 HTML,它就不是很有用。

http://jsfiddle.net/isherwood/nf5tP/

关于javascript - 如何使用 jQuery CSS 方法传递媒体查询,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22918819/

65 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com