基于URL哈希的滑块
URL hash based slider
JS Fiddle
原始想法/这个问题的另一个版本
注意 这个想法的另一个版本/原始想法已经得到了回答,所以如果其他版本对你有效,欢迎:)
这个问题仍然悬而未决
这是我遇到麻烦的新想法。我想制作一个图像滑块。滑块中有所有的图像,当页面变成像#home这样的散列时,我希望滑块更新为新图像。滑块浮动。另一件事是,我不希望它滚动通过其他图像。我只想让它直接滚动到那个图像。我还需要垂直滚动,因为图像的宽度不同。我感觉很糟糕,因为我基本上是在提出工作请求,所以这是我认为正确的。如果有人告诉我需要做什么,我可以写代码
这是JS Fiddle上的代码。我只是有链接,所以它可以工作:
//This also need to execute when the hash is updated/an anchor link is clicked
window.onLoad = function hashLogo() {
var hash = window.location.hash;
//Image 1 Hashes
var image1 = [
'#image1',
'#home'
];
//Image 2 Hashes
var image2 = [
'#image2',
'#about'
];
if (image1.indexOf(hash) > -1) {
//Do jQuery Sliding
}
if (image2.indexOf(hash) > -1) {
//Do jQuery Sliding
}
};
我认为您需要的是对hashchange事件进行事件拦截:
$(window).hashchange( function(){
// Do something when the hash changes
// alert( location.hash );
});
如果你也使用Ben Alman的出色的hashchange插件(0.8kb),它也将确保事件被聚合到不支持它的浏览器中。
相关文章:
- Steam Web API:I'我不知道该如何处理这个看起来像哈希的url来生成图像
- 使用Javascript/jQuery以编程方式将当前锚点/哈希/片段附加到任何表单操作url
- 重定向不带哈希的URL-Ember.JS
- 在我的图库(jQuery)中使用箭头导航时,更改URL中的哈希
- 需要url哈希修复
- 单击引导模式锚点时添加 URL 哈希
- 根据 URL 中的哈希移动 HTML
- 使用Flexslider进行哈希URL导航
- 使用 html5 历史记录代替哈希 URL 来恢复用户的历史记录
- 哈希 URL 参数,MD5 哈希 (PHP)
- 用于对数据进行排序的多个 (2) 个哈希 URL 参数
- 加载内容时取决于哈希 URL 参数
- Div 叠加层淡入历史记录,并可使用哈希 URL 添加书签
- AngularJS并使用使用哈希URL的js / css库
- 如何从哈希 url 获取参数
- 在Backbone.js中组合哈希和非哈希URL
- 使用哈希URL时不需要的页面跳转
- 如何从哈希url使用id更改内容
- 从URL中删除哈希,以无哈希URL加载页面,然后在不重新加载页面的情况下向URL添加哈希
- 正则表达式匹配哈希URL字符串