1

基本的に、私は現在、ヘッダーをクリックするとリンクを表示するスライドダウンメニューを持っています。これを水平スライドに変更したいのですが、私の知識は現在HTMLとCSSのみです。つまり、jquery/javascriptはあまり得意ではありません。

そうですね、ここに例があります（CATEGORIESをクリックしてください）http://newsunken.tumblr.com/ カテゴリをクリックすると、カテゴリが左から右にスライドし、「CATEGORIESTEESJUMPERSHEADWEAR」のように表示されるようにしたいと思います。ごめんなさい初心者の質問！

$('#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 に答える