1

基本上，我目前有一个下拉菜单，当您单击标题时会显示链接。我希望将其更改为水平幻灯片，但我目前仅了解 HTML 和 CSS，换句话说，我不太擅长 jquery/javascript。

所以，是的，这是一个示例（单击类别）http://newsunken.tumblr.com/ 我希望这样当您单击类别时，类别会从左向右滑动并显示为“CATEGORIES TEES JUMPERS HEADWEAR”菜鸟问题！

$('#box').click(function()
{ 
$(this).animate({
    width: '350px'
  }, 300, function() {
    // Animation complete.
  });
});

和

<div id="box" style="width:70px; height: 20px;overflow:hidden; border:1px solid black;">Categories Tees Jumpers Headwear Gift Vouchers</div>

这是我能想出的最好的东西，但不像 newsunken.tumblr.com 上的那样时尚

4

2 回答 2

0

我不确定它是否是您正在寻找的东西，但试试这个：

$('#box').click(function()
{ 
$(this).animate({
    height: 'toggle',
    width: '350px'
  }, 300, function() {
    // Animation complete.
  });
});
于 2013-01-14T12:29:49.513 回答
0

这个脚本可以水平滑动，以防我显示整个页面。请注意 document.ready 功能

<html>
<head>
<title>sliding</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
     $('#box').click(function()
    { 
        $(this).animate({width: '350px'}, 300, function() {
        // Animation complete.
        });
    });    
});
</script>
</head>
<body>
    <div id="box" style="width:70px; height: 20px;overflow:hidden; border:1px solid black;">Categories Tees Jumpers Headwear Gift Vouchers</div>
</body>
</html>
于 2013-01-14T12:39:20.513 回答