欢迎各位兄弟 发布技术文章

这里的技术是共享的

You are here

jquery 水平方向和垂直方向滑动隐藏和显示 渐渐 隐藏和显示 有大用

shiping1 的头像

 

//这个 2000 非要数字 不能加 单引号,否则不起作用
$(".content_Mb_kecheng_jiegoucontent").animate({top:'0',left:'2%',width:'96%',height:'612px',opacity: '1'}, 2000,function(){});


水平方向滑动隐藏

jQuery('#divFloatToolsView').animate({width: '300px', opacity: 'hide'}, 'normal',function(){ jQuery('#divFloatToolsView').hide();});

 

水平方向滑动显示

jQuery('#divFloatToolsView').animate({width: '300px', opacity: 'show'}, 'normal',function(){ jQuery('#divFloatToolsView').show();});

 

当然 把width 变成 height 就是垂直显示或隐藏了

 

 

 

 

使用 jQuery 实现元素的横向滑入滑出
2012年04月02日 | IT点滴 | 浏览 2,661 | 暂无评论

虽然 jQuery 有一组漂亮的幻灯片效果:.slideDown(),.slideUp() 和 .slideToggle(),它们的滑动方向都是垂直的。有时,我们可能需要水平方向的滑动。最简单的方法是通过对元素的 width 属性使用 .animate() 方法来实现。

  1. $(document).ready(function() {   
  2.   $('#slidewidth button').click(function() {   
  3.     $(this).next().animate({width: 'toggle'});   
  4.   });   
  5. });  

应用举例

请从下面的词汇表里选择答案来完成句子。
(点击下划线处可显示/隐藏答案)
billed as / paraded / festivities / renovated / spectacle

1. But, apart from concerns over potential increased rent in social housing, she was against the current proposals to move long-term residents into different ________________renovated homes on site.
 

 

来自 http://hykloud.com/2012/04/02/information_technology/jquery-sliding-div-horizontally-show-hide/

普通分类: