对图像使用HTML中的数据属性，而不是javascript编辑

我绞尽脑汁想找到解决问题的正确方法。我的粘性标题有以下代码

$（窗口）。滚动（函数（）{
如果（$（this）.scrollTop（）>50）
{
$（'.sticky-navbar'）.addClass（'sticky'）；
}否则{
$（'sticky navbar'）。removeClass（'sticky'）；
}
});
$（窗口）。滚动（函数（）{
如果（$（“.navbar”）.offset（）.top>50）{
$（'.navbar brand img'）.attr（'src'，'assets/images/logo sticky.png'）；
}否则{
$（'.navbar brand img'）.attr（'src'，'assets/images/logo.png'））
}   
});






据我了解，您希望根据滚动高度切换图像徽标：
您可以将链接存储在数据属性中，如：

<img src="" alt="" data-logo="assets/images/logo.png" data-sticky="assets/images/logo-sticky.png">

要在页面加载时在
src
中添加徽标：

$(document).ready(function(){
    $('.navbar-brand img').attr('src',$('.navbar-brand img').data('logo'));
});

jsfiddle

希望有帮助：）
根据我的理解，您希望根据滚动高度切换图像徽标：
您可以将链接存储在数据属性中，如：

<img src="" alt="" data-logo="assets/images/logo.png" data-sticky="assets/images/logo-sticky.png">

要在页面加载时在
src
中添加徽标：

$(document).ready(function(){
    $('.navbar-brand img').attr('src',$('.navbar-brand img').data('logo'));
});

jsfiddle

希望有帮助：）

将
数据粘性
属性添加到图像元素。这将是
选择应用图像时要在图像上更新的值
最初存储用于反转的默认图像src值
切换
.sticky
滚动上的类和图像src
因此，您的图像将如下所示：

<img src="assets/images/logo.png" alt="" data-sticky="assets/images/logo-sticky.png" />

将
数据粘性
属性添加到图像元素。这将是
选择应用图像时要在图像上更新的值
最初存储用于反转的默认图像src值
切换
.sticky
滚动上的类和图像src
因此，您的图像将如下所示：

<img src="assets/images/logo.png" alt="" data-sticky="assets/images/logo-sticky.png" />

如果想法是切换数据和src，那么您可以这样做。同样，如果所有图像对都被称为x和x-sticky，那么您只需将“-sticky”添加到图像的当前src，而不需要数据属性。感谢您的回复。不，这个想法是从javascript代码中删除URL，并在用户向下滚动时显示粘性徽标而不是常规徽标。因此，当用户向下滚动时，您是否会切换数据粘性和src？因此javascript将类似于
$（'.navbar brand img'）.attr（'src'，$（'.navbar brand img'）.attr（'data-sticky'）或者你打算使用CSS来检测何时使用数据粘滞或src？恐怕我不明白你的意思。如果我做对了，我会在用户滚动时添加一个.sticky navbar类（带有jQuery），只要该类出现，我就会希望常规徽标切换到带有数据sticky logo属性的sticky版本，在那里我可以在index.html文件中更改其名称、路径等，而不是在javascript中。谢谢啊好的。我也不明白。我不知道JQuery可以做到这一点。所以忽略我的评论。如果想法是切换数据粘滞和src，你可以这样做。同样，如果所有图像对都被称为x和x-sticky，那么您只需将“-sticky”添加到图像的当前src，而不需要数据属性。感谢您的回复。不，这个想法是从javascript代码中删除URL，并在用户向下滚动时显示粘性徽标而不是常规徽标。因此，当用户向下滚动时，您是否会切换数据粘性和src？因此javascript将类似于
$（'.navbar brand img'）.attr（'src'，$（'.navbar brand img'）.attr（'data-sticky'）或者你打算使用CSS来检测何时使用数据粘滞或src？恐怕我不明白你的意思。如果我做对了，我会在用户滚动时添加一个.sticky navbar类（带有jQuery），只要该类出现，我就会希望常规徽标切换到带有数据sticky logo属性的sticky版本，在那里我可以在index.html文件中更改其名称、路径等，而不是在javascript中。谢谢啊好的。我也不明白。我不知道JQuery可以做到这一点。所以不要理会我的评论。这是一个绝妙的解决方案！非常适合我，非常感谢！这是一个绝妙的解决方案！非常适合我，非常感谢！