动画宽度切换时,它不是动画填充,所以我查看.outerWidth(),但我不确定如何实现这个...
$('#shareheart').click(function(){
$('.share-text').animate({outerWidth: 'toggle'}, 2000)
})
我有一个按钮可以打开和关闭DIV层.我正在尝试向按钮添加一个类,以便当它在其上切换时显示不同,但是我无法使其工作,在切换按钮时不会添加该类.
该按钮是列表项,例如开/关
这是我的代码:
$("#btninformation").click(function () {
$("#map-items-category-one").toggle("slow", function() {
$(this).toggleClass("toggled-on");
});
});
任何想法都有错吗？
谢谢扎克
我有这个切换功能
$('#togglebtn').toggle(function() {
$('#panel').show();
}, function() {
$('#panel').hide();
});
我还有另一个按钮来关闭/隐藏面板
$('#otherbtn').click(function() {
$('#panel').hide();
});
我想说的是,当我隐藏面板时#otherbtn,事件仍然处于活动状态#togglebtn并给我一个额外的点击以再次开始切换面板.我该如何解决这个问题？
我有一个页面上的链接列表,当用户点击我希望它突出显示的链接时,同时我希望其余的链接变得不突出.在http://api.jquery.com/toggleClass/中间的演示 完全符合我的要求,但它允许您一次突出显示许多链接.任何人都可以建议我需要调整以使其工作吗？非常感谢.
我想使用Flip Switch Toggle小部件让用户在页面上的两个div之间切换(淡入淡出).我知道该元素通常用于在表单中的二元期权之间进行选择,因此这会有一些元素滥用,但我认为应该可以通过创意重复使用.
但是,表单文档说你需要处理所有表单服务器端,而我想避免服务器事务 - 我已经在页面中有两个div.
这甚至可能吗？
我不确定为什么这不起作用......
HTML
<table>
<tr>
<th>Name</th>
<th>Options</th>
</tr>
<?php // loop over items
while ($row = mysql_fetch_assoc($qry)){ ?>
<tr>
<td><?=$row['name'];?></td>
<td<a href="#" class="trigger">Detail</a></td>
</tr>
<tr>
<td colspan="100%" class="details">
stuff
</td>
</tr>
<?php
} ?>
</table>
那我正在使用的jQuery是......
$(document).ready(function () {
$('.trigger').click(function() {
$(this).parents("table").siblings(".details").slideToggle();
// also tried this...
// $(this).parents("table").nextAll(".details").slideToggle();
return false;
});
});
我已经尝试将细节类移动到TR.我想要的是当有人点击"详细信息"链接时,以下TR应该切换.我在顶级表上放了一个ID,并提醒父母的attr('id'),这是有效的.将".siblings"更改为".find"可以切换所有内容.
谢谢你的帮助.
我有一个jsFiddle工作我想要的:http://jsfiddle.net/6wuUc/64/
但由于某种原因,当我使用完全相同的代码时,我点击按钮时没有得到动画.这是我在我的页面上使用的代码.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="_/css/style.css">
<script src="_/js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script>
$('.sv_play_button').toggle(function(){
$('#video').animate({left: '346'}, "fast");
},function(){
$('#video').animate({left: '0'}, "fast");
});?
</script>
</head>
<body>
<div id="video">
<div class="sublime">
<p class="sv_play_button">Click</p>
</div>
</div>
</body>
</html>
而CSS:
#video, #video .sv_play_button {position: absolute;}
#video { margin-left: -346px; width: 670px; height: 546px; background-color: blue;}
.sublime { width: 1016px; height: 546px; background-color: red; opacity: 0.8; }
.sv_play_button {padding: 5px; background-color: yellow; top: 0px; right:0px; }?
任何人都知道为什么toggle()不能在我的页面上工作？提前致谢.
我正在制作一个职业页面,该页面将显示工作描述的简短预览以及切换,单击该切换时,将向下滑动以显示发布的更多详细信息.
标记看起来像这样:
<div>
<div class="career-excerpt">
<p>Preview text goes here</p>
</div>
<div class="career-details">
<p>Longer explanation / detail text goes here</p>
</div>
<p><a class="toggle" href="#">Show Details</a></p>
</div>
这是我用来切换打开详细信息部分的jQuery:
$(".career-details").hide();
$(".toggle").click(function () {
$(".career-details").toggle("fast",function() {
$('.toggle').text(
$(this).is(':visible') ? "Hide Details" : "Show Details"
);
});
});
这可以打开详细信息并将文本从"显示详细信息"更改为"隐藏详细信息".但是,每个页面上都会有多个帖子,使用此代码,单击切换一次将导致打开所有描述.
我希望切换到仅在点击的切换的同一父div内打开"职业细节"div.
我试过改变:
$(".career-details").toggle("fast",function() {
至:
$(this).closest(".career-details").toggle("fast",function() {
但在那之后,肘节似乎根本不起作用.任何想法将不胜感激,谢谢!
我正在尝试创建一个复选框,它将改变点击时的表单操作.我开始时将其设置为根据是否检查消息来警告消息,但没有发生任何事情.请帮我!
JavaScript的:
function toggleAction(){
var check = document.getElementById('checkb').checked;
if (checked == "1"){
alert("is checked");
}else{
alert("is not checked"); }
}
HTML:
<INPUT TYPE="checkbox" id="checkb" onclick="toggleAction()">Add Another<br>
我有一个选择菜单,一些div与之关联.我希望选择菜单根据选择菜单值隐藏/显示div.但是如果jQuery没有找到关联div,那么它应该警告一些文本.
这是我的代码:
$('select').change(function(){
var div = $(this).val();
$('#results div').hide();
$('#' + div).show();
});#results div {
display: none;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
<option value="div_1">Div 1</option>
<option value="div_2">Div 2</option>
<option value="div_3">Div 3</option>
</select>
<div id="results">
<div id="div_1">Div 1</div>
<div id="div_2">Div 2</div>
</div>正如你在上面的例子中所看到的那样,没有DIV 3我想要一个警告说没有DIV 3找到.
任何形式的帮助赞赏:)
toggle ×10
jquery ×8
html ×2
javascript ×2
checkbox ×1
closest ×1
conditional ×1
css ×1
dom ×1
highlight ×1
onclick ×1
outer-join ×1
toggleclass ×1
width ×1