slideToggle正是我想要的,只是我希望幻灯片是水平的.
我现在有一个水平隐藏/显示和动画点击,但我想有切换选项.因此,当我点击活动链接时,它将播放动画反转并隐藏自己.
最好的方法是什么？
我的目标slideToggle() div需要display:inline-block而不是display:block它打开时.有没有办法在这里改变jquery行为？
编辑:
我目前正在使用jQuery 1.7.0.此外,<div>最初是在display:none并且应该display:inline-block在点击链接后扩展到; 但显然这种情况下slideToggle()的默认状态是display:block......
slideToggle是否与表一起使用？
我想slideToggle一行表.但它似乎没有任何影响.
我的jQuery slideToggle()实验
任何人都可以告诉我为什么我打开它时我的盒子"跳"？上半场他们滑了,剩下的他们"跳"？
谢谢, 约翰内斯
我有一个Jquery Ui按钮(#toggleIcons),当单击时,切换div(.icons)以显示一些图标.我还使用Jquery Isotope和Infinitescroll动态添加新图像.我想要做的是在添加和更新新图像时有一种方法可以保留slideToggle状态.Ifinitescroll有一个回调函数,以便我可以更新页面和图标的状态.
//My button click function
$("#styleSwitcher #toggleIcons" ).click(function() {
$('.icons').slideToggle('slow');
//for Isotope to update the layout
$('#container').isotope('reLayout')
return false;
});
//code I am working on to put in callback to test if div is open or closed
if($(".icons").is(":hidden"))
{
$('.icons').hide();
}
else
{
$('.icons').show();
}
不工作.任何帮助或方向将不胜感激.谢谢
我有一个带有thead和tbody部分的表.我已成功应用了一个slideToggle,但动画已被破坏.
当用户点击thead时,我希望tbody的内容向上滑动.目前发生的事情是该部分只是消失,没有任何动画.
这是表格
<table>
<thead>
<tr>
<td colspan="3">TABLE HEADING</td>
</tr>
</thead>
<tbody>
<tr>
<td class="first" colspan="1">Cell Contents</td>
<td colspan="1">Cell Contents</td>
<td colspan="1">Cell Contents</td>
</tr>
</tbody>
</table>
这是我正在使用的jQuery:
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$("thead").click(function () {
$(this).next("tbody").slideToggle("slow");
}
)
});
</script>
我试图滑动jquery .slideToggle但我无法在点击div(nav)时从左到右或从右到左添加方向.请帮帮我,下面是我的代码.
<!DOCTYPE html>
<html>
<head>
<style>
p { width:400px; float:right;background:#e4e4e4; margin:5px;padding:5px;}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body style="font-size:10px; color:#333;">
<div style="width:50px; height:15px;float:right;background:#ccc;border:1px solid #333;text-align:center;">Nav</div>
<p>
This is the paragraph to end all paragraphs. You
should feel <em>lucky</em> to have seen such a paragraph in
your life. Congratulations!
</p>
<script>
$("div").click(function () {
$("p").slideToggle("slow");
});
</script>
</body>
我是jquery的新手,非常感谢.
我正在尝试将单独的javascript文件mobile-menu.js加载到我的Wordpress主题中.当我看到控制台时,它说,"jQuery没有被定义." 但是,我知道我正确地将我的脚本文件排入队列.有任何想法吗？
HTML文件:
<a href="#" id="menu-icon"></a> <!--this line wasn't here originally-->
<div id="switchmenu"><!--switchmenu begin-->
<?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>
</div><!--switchmenu end-->
functions.php文件:
function lapetitefrog_scripts() {
wp_enqueue_style( 'lapetitefrog-style', get_stylesheet_uri() );
wp_enqueue_script( 'lapetitefrog-mobile-menu', get_template_directory_uri() . '/js/mobile-menu.js', array(), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'lapetitefrog_scripts' );
mobile-menu.js文件:
jQuery(document).ready(function($) {
$('#menu-icon').click(function() {
$('#switchmenu').slideToggle("fast");
});
});
我已经寻找了一段时间的解决方案,但似乎无法找到它.我想也许.clearQueue()在我的小提琴中使用JQuery ,但它不起作用.
这是小提琴.
要清楚:我希望sideToggle()执行,但是一旦它再次被点击并且第一个slideToggle()还没有完成,它应该停止第一个动画并向后滑动.使用该.clearQueue()方法它可以工作两次点击,但是当点击例如三次时,盒子消失并且heigt以某种方式搞砸了.
我知道hover()有默认设置handIn和handOut,但反正我有可以检测slideUp和SlideDown里面SlideToggle？
有这样的代码:
$("#divName").slideToggle(function(){//when slideUp, do something},
function(){//when slideDown, do something});
我尝试过这段代码,但没有运气,你们认为这有时会让事情变得更容易吗？
jquery ×10
slidetoggle ×10
html ×2
css ×1
if-statement ×1
javascript ×1
jsfiddle ×1
php ×1
toggle ×1
wordpress ×1