JQuery 即时添加类或隐藏类
当添加 JQuery 来隐藏类时,它当然会等待页面加载然后隐藏该类,“addClass”也是如此。必须有一种更好或更快的方式来在页面加载时“加载”。有人知道有什么想法吗?我在下面为我的网站提供了 JQuery 脚本,并提供了查看它们实际运行情况的链接:
隐藏子过滤器: 链接到我的脚本示例以隐藏子过滤器(注意左侧导航过滤器)
if(jQuery('.refinement_category_section').length){
jQuery('.refinement_custom_category_section').hide() &&
jQuery('.refinement_filter').hide();
}
jQuery(document).ready(function(){
if(jQuery('.refinement_category_section').length){
jQuery('.refinement_custom_category_section').hide() &&
jQuery('.refinement_filter').hide();
}
});
或
添加类: 链接以我的脚本添加 Class 的示例(注意左侧导航过滤器)
$('.refinement_brand_section').parent().addClass('filterresults');
When adding JQuery to hide a class it of course waits for the page to load then hides the class, same thing for 'addClass'. There has got to be a better or faster way for it to 'load' as the page is loading. Anyone know of any ideas? I have given my sites JQuery scripts below with links to see them in action:
Hides sub filters: Link to example of my script to hide sub filters (notice left navigation filters)
if(jQuery('.refinement_category_section').length){
jQuery('.refinement_custom_category_section').hide() &&
jQuery('.refinement_filter').hide();
}
jQuery(document).ready(function(){
if(jQuery('.refinement_category_section').length){
jQuery('.refinement_custom_category_section').hide() &&
jQuery('.refinement_filter').hide();
}
});
OR
Adds a Class:Link to example of my script adding Class (notice left navigation filters)
$('.refinement_brand_section').parent().addClass('filterresults');
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
使用 Firebug,问题似乎出在您正在加载的图像数量上。我的建议是在应用样式更改后使用 JavaScript 动态加载项目的图片,或者页面上的项目数量较少(或两者兼而有之)。这将导致非 JavaScript 用户的界面性能下降,但仍能正常工作。对于支持 javascript 的浏览器,您可以调整加载图像的方式和数量,仍能达到良好的效果。
您还应该为您的小界面元素使用精灵,以便您下载单个图像并使用 CSS 来显示它的各个部分。将您的 javascript 文件和样式表结合到您的生产站点也会有很大帮助 - 您有 20 多个 js 文件和 13 个以上样式表,每个文件都需要一个单独的请求。您可能想要运行 YSlow 并遵循它的其他建议。
Using Firebug, it appears that the issue is with the number of images that you are loading. My suggestion is to dynamically load pictures for your items using javascript after applying your style changes or have a smaller number of items on the page (or both). This will result in a degraded, but still functional interface for non-javascript users. For javascript-enabled browsers, you can adjust how and how many images are loaded to still achieve a nice effect.
You should also use sprites for your small interface elements so that you're downloading a single image and using CSS to display various portions of it. Combining your javascript files and stylesheets for your production site would also help quite a bit -- you've got 20+ js files and 13+ stylesheets, each of which requires a separate request. You might want to run YSlow and follow it's other recommendations.
您可以添加 CSS 规则来隐藏这些类,然后在 jquery 加载后更改它
you can add CSS rules to hide these classes and then change it after jquery loads