如何在不滚动后破坏响应式布局的情况下使用更大的徽标 [英] How do I use a larger logo without ruining the responsive layout after scrolling

问题描述

我已经从模板创建了一个网站。除了徽标之外，其他所有工作都很好;模板中的默认徽标非常小，所以我将其更改为我自己的徽标，这个徽标更宽。现在，每当我向下滚动页面时，导航栏（在滚动时响应并转换）然后变得太宽并且不会返回到其原始大小。使用与样本徽标（114x23）相同大小的徽标可以解决问题，但我的徽标在这个尺寸上太小了。请帮忙！

I have created a website from a template. Everything else works fine other than the logo; the default logo from the template was very small so I changed it for my own logo, which is wider. Now, whenever I scroll down the page, the navbar (which is responsive and transitions when scrolling) then becomes too wide and does not return to its original size. Using a logo the same size as the sample logo (114x23) fixes the problem but my logo is far too small at that size. Please help!

推荐答案

您可以尝试通过Javascript添加一些css，这样当导航栏滚动时它会调整徽标的大小以确保它正确匹配？

You could try adding some css through Javascript so when the navbar scrolls it resizes the logo to make sure it fits correctly?

.smaller {
     max-width: 100px;
}

（窗口）.scroll（function（）{
var scroll =

(window).scroll(function() { var scroll =

（window）.scrollTop（）;

(window).scrollTop();

这篇关于如何在不滚动后破坏响应式布局的情况下使用更大的徽标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！