我遇到了麻烦。如果您在手机上查看此网站或将浏览器调整为手机大小,向下滚动,然后再向上滚动, Logo 会变得非常大。我需要它像开始时一样小(刷新页面): http://www.baycrest.org/birdie4baycrest/
我确实有 CSS 断点,但由于某些特定的原因,我正在使用 JS。这是我的 JS 代码:
$(window).scroll(function () {
if ($(document).scrollTop() == 0) {
$('.logo').attr('src', '/birdie4baycrest/images/logobig3.jpg');
$('.logo').width(203);
$('.logo').height(293);
} else {
$('.logo').attr('src', '/birdie4baycrest/images/logobig.jpg');
$('.logo').width(108);
$('.logo').height(70);
}
});
最佳答案
这是一个基于我之前评论的解决方案。在 Chrome 检查器中测试并处理您的网站。
$(window).scroll(function () {
if ($(document).scrollTop() == 0) {
$('.logo').attr('src', '/birdie4baycrest/images/logobig3.jpg');
if( $(window).width() < 768 ){
// logo loads at small size with a width of 104 and height of 150
$('.logo').width(104);
$('.logo').height(150);
} else {
// this is what the default is for large sizes
$('.logo').width(203);
$('.logo').height(293);
}
} else {
$('.logo').attr('src', '/birdie4baycrest/images/logobig.jpg');
$('.logo').width(108);
$('.logo').height(70);
}
});
关于javascript - Logo 在移动设备上变大(Javascript),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42016500/