javascript - 鼠标悬停时双级滑动 DIV

标签 javascript jquery css

我正在尝试创建与站点 http://tracelytics.github.io/pageguide/ 中类似的效果当您将鼠标悬停在屏幕左侧的“页面指南”图标上时,它会进一步扩展并显示另一级别的信息。

我怎样才能得到这个效果?我也想使用相同的图标。

我不知道从哪里开始。任何示例 fiddle 或插件都会帮助我。谢谢。

最佳答案

http://jsfiddle.net/fenderistic/SqjfT/

这是我创建的一个非常简单的实现,它模拟了您在该插件中看到的内容。

var old;
$(".hover").hover(
function(){
    old = $(this).css("right");
    $(this).animate({right:"0"},100);  
}, function() {
    $(this).animate({right:old},100);  
}
)

关于javascript - 鼠标悬停时双级滑动 DIV,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21121705/

相关文章:

javascript - jQuery children() 和 find() : anything that looks like closest()? 之间的解决方案

javascript - jQuery 库干扰导航栏和可过滤投资组合的 Javascript 小问题 - bootstrap 3

css: table-row: 强制一个表格行占据表格的全高并将第二行推出可见区域的方法

javascript - Bootstrap 日期选择器在 IE8 中没有响应

javascript - Mochikit 还是 JavaScript 框架原型(prototype)?

javascript - 从 jQuery 执行同步 Ajax 请求?

php - 如何将一个类添加到一个动态菜单项?

javascript - 模态框内的图像

javascript - text/plain 和 string 之间有区别吗?

javascript - 错误 : Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience