Toggle Blind Effect - PullRequest
Новая
       44

Toggle Blind Effect

0 голосов
/ 12 марта 2010

Есть ли способ изменить этот сценарий, чтобы использовать его как слепой эффект. 

// 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';

Я удалил Показать / Скрыть текст, потому что я применяю ссылку к различным областям текста. Мне нравится эффект Blind против этого эффекта Toggle, и я должен знать, как его применять, если это возможно. Я не могу найти базовый сценарий эффекта слепого, который позволяет использовать ссылку на ЛЮБОЙ текст вместо кнопки или статического текста.

Спасибо! Надеюсь, вы можете помочь! Tracy

1 Ответ

1 голос
/ 13 марта 2010

Я, кажется, понял это, ДУХ! Изменяя 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>');

Вернемся к этому эффекту скольжения [Прямое скольжение вниз / вверх против входа / выхода из верхнего / левого угла]: После того, как я понял, что замена .toggle на .slideToggle добилась цели, я заменил строку следующим образом: 

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

вместо: 

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

Теперь у меня есть контроль над скоростью, что делает плавное скольжение.

Для HTML просто примените класс "toggleLink" к любой ссылке с href = "#". Для скрытого DIV примените класс «toggle».

...