0

ブラインドエフェクトとして使用するようにこのスクリプトを変更する方法はありますか？

// Andy Langton's show/hide/mini-accordion - updated 23/11/2009
// Latest version @ http://andylangton.co.uk/jquery-show-hide

// this tells jquery to run the function below once the DOM is ready
$(document).ready(function() {

// choose text for the show/hide link - can contain HTML (e.g. an image)
var showText='';
var hideText='';

// initialise the visibility check
var is_visible = false;

// append show/hide links to the element directly preceding the element with a class of "toggle"
$('.toggle').prev().append(' <a href="#" class="toggleLink">'+showText+'</a>');

// hide all of the elements with a class of 'toggle'
$('.toggle').hide();

// capture clicks on the toggle links
$('a.toggleLink').click(function() {

// switch visibility
is_visible = !is_visible;

// toggle the display - uncomment the next line for a basic "accordion" style
//$('.toggle').hide();$('a.toggleLink').html(showText);
$(this).parent().next('.toggle').toggle('slow');

// return false so any link destination is not followed
return false;

});
});

FYI-
Where it says:
var showText='';
var hideText='';

It was originally:
var showText='Show';
var hideText='Hide';

テキストのさまざまな領域にリンクを適用しているため、テキストの表示/非表示を削除しました。私はブラインド効果とこのトグル効果が好きで、可能であればそれを適用する方法を知る必要があります。ボタンや静的テキストではなく、任意のテキストにリンクを適用できる基本的なブラインド効果スクリプトが見つかりません。

ありがとう！あなたが助けることができることを願っています！トレーシー

4

1 に答える 1

1

私はそれを理解したようだった、DUH！次の行の 1 単語を変更します。

$(this).parent().next('.toggle').toggle('slow');

これに変更：

$(this).parent().next('.toggle').slideToggle('slow');

単純に変更:
.toggleに.slideToggle

不要な行も完全に削除しました。

var showText='';
var hideText='';

もともと言った：

var showText='Show';
var hideText='Hide';

非表示の DIV をアクティブにするリンクをさまざまなテキストに適用したかったためです。

これに関連する他の行も削除しました。

$('.toggle').prev().append(' <a href="#" class="toggleLink">'+showText+'</a>');

これをスライド効果にすることに戻ります[まっすぐにスライドする/上にスライドする vs. 上/左隅から出入りする]: への変更.toggleが.slideToggleうまくいったことを理解した後、次の行を次のように置き換えました。

$(this).parent().next('.toggle').animate({"height": "toggle"},{duration: 1000});

それ以外の：

$(this).parent().next('.toggle').slideToggle('slow');

これで速度を制御できるようになり、スライドがよりスムーズになりました。

HTML の場合、href="#" を含むすべてのリンクにクラス "toggleLink" を適用するだけです。非表示の DIV には、クラス「トグル」を適用します。

于 2010-03-13T16:51:49.907 に答える