我有这个小脚本来点击按钮时切换联系表格:
$(document).ready(function(){
$("#button").click(function () {
$("#form").toggle("slow");
});
});
一切都在Firefox中运行正常,但在IE中,似乎切换的淡入效果不会100%完成,并且文本在完整渲染之前被"冻结",失去了所有精细分辨率.
我读了这个主题,但我不确切知道如何将它应用到我的问题.
谢谢你的帮助.
我需要一个Flash/AS3中的按钮,可以在打开和关闭之间切换.所以我很高兴看到这个Button类有toggle属性让我有这种行为.我不太高兴看到当我在Flash文件中创建一个"按钮"时得到的是SimpleButton类的实例,它没有该选项.
有没有办法从.fla获取Button实例,或者让SimpleButton表现为切换？
我有以下代码可以工作但在每个切换操作结束时变得有点跳跃.
如果我切换段落会更顺畅吗？
我试图得到段落,但我不知道该怎么做.
有人可以帮我吗？
提前致谢.
<head>
<style type="text/css">
body {width: 660px; margin: 0 auto; }
.toppara{
background-color: #FF9;
}
.morepara {
background-color: #fff;
display:none;
}
.togglebutn {
color: #900;
background-color: #FFF;
}
</style>
</head>
<body>
<div id="section1">
<div class="toppara"><p>Content 1.</p>
</div>
<div class="morepara">
<p>
Content 2.
</p>
</div>
<p class="togglebutn">
<a>Show/Hide</a>
</p>
</div><!-- section 1 -->
<!-- section 2 -->
<div id="section2">
<div class="toppara"><p>Content 3.</p>
</div>
<div class="morepara">
<p>
Content 4.
</p>
</div>
<p class="togglebutn">
<a>Show/Hide</a>
</p>
</div><!-- section 2 …我想创建一个脚本,根据其他元素可见性更改切换链接文本.
因此,虽然#form是可见的,但我希望#form-container文本为"Hide ...",虽然它是隐藏的,但我希望文本为"Show ...".
我试过这一行 - 如果($('#form').是(":visible")){另一种方式:if($('#form').is(":visible")=="true "){ - 但它也不起作用.
怎么了？每次切换另一个项目时如何更改文本？
$('.toggle').click(
function()
{
$('#form').slideToggle();
if($('#form').is(":visible")){
$('#form-container a').text("Hide form container");
}
else {
$('#form-container a').text("Show form container");
}
});
谢谢.
我一直在寻找各处,无法找到任何地方.
html结构基本上是.
<ul>
<li><a href="">link</a></li>
<div id="us">hidden info</div>
</ul>
css结构是.
#us {display:none}
我喜欢它,所以当点击"链接"时,div"us"从dipslay改为:none; 显示:阻止,在尽可能少的代码行中优雅地淡入淡出,然后在单击链接时再次切换回显示:隐藏.
我知道有很多东西可以做到这一点,但我真的在寻找代码中的简单性.
谢谢你的时间x
我已经浏览了一些类似的问题 - 但我一直在寻找,并且没有运气找到与我正在寻找的实现相同的实现.
这非常简单:
<a class="contacttoggle" href="#">Contact</a>
<div>Lots of content between</div>
<div>Lots of content between</div>
<div>Lots of content between</div>
<div>Lots of content between</div>
<div class="contact_box">Contact info that is initially hidden and then fades in when the "contact_toggle" Contact link above is clicked</div>
我正在寻找这个淡入淡出它将绝对定位在页面上(不用担心我可以处理CSS).我只是不想要幻灯片效果.刚刚淡入.
我觉得这个代码应该工作,但它不是:(
$(document).ready(function(){
/* function to show and hide main navigation conatct box */
$(".contact_box").hide();
$('a.contacttoggle').click(function() {
$(this).next("div").find(".contact_box").toggle(400);
return false;
});
})
我有一些缩略图,当你悬停时,它们会有一个淡入淡出的播放按钮.我的问题是,当你反复盘旋它们时,说三次,它们会淡入淡出三次.我曾经遇到过一个jQuery函数,其中包含一个if then语句粗略地说它是否是动画而忽略了进一步的输入..但我不确定语法是做什么的.
想法？谢谢!
这是一个jsFiddle:http: //jsfiddle.net/danielredwood/66FwR/10/
HTML:
<div id="music_right">
<div class="thumbnail" id="paparazzi">
<a class="playback">
<img class="play" src="http://www.lucisz.com/imgs/play.png" />
</a>
<audio>
<source src="../audio/fernando_garibay_paparazzisnlmix.ogg" type="audio/ogg" />
<source src="../audio/fernando_garibay_paparazzisnlmix.mp3" type="audio/mpeg" />
Your browser does not support HTML5 audio.
</audio>
</div>
<div class="thumbnail" id="danceinthedark">
<a class="playback">
<img class="play" src="http://www.lucisz.com/imgs/play.png" />
</a>
<audio>
<source src="../audio/fernando_garibay_danceinthedark.ogg" type="audio/ogg" />
<source src="../audio/fernando_garibay_danceinthedark.mp3" type="audio/mpeg" />
Your browser does not support HTML5 audio.
</audio>
</div>
<div class="thumbnail" id="bornthisway">
<a class="playback">
<img class="play" src="http://www.lucisz.com/imgs/play.png" />
</a>
<audio>
<source src="../audio/fernando_garibay_bornthisway.ogg" type="audio/ogg" …我刚刚通过这里的答案在jQuery中使用了这段代码 -
$('.folder-items a').hover(function(){
$(this).siblings('.file-hover').toggle();
});?
的.folder-items一个是利内.我希望能够悬停整个'li',而不仅仅是在实际上<a>显示.file-hoverdiv.
我已经在jsfiddle中创建了这个 - http://jsfiddle.net/8Sefc/8/ - 但是当我将鼠标移动到li时它会像疯了一样显示/隐藏...
我认为这与我的CSS和显示有关:块; 宽度:100%; 李和李的一个,但不能解决另一种方式这样做...
想法？
我想要做的是在不同的div之间切换.这有点难以解释,但我会试一试.
当页面加载时,会有div可见,4有display:none.还有一个菜单.链接1将显示第一个div并隐藏所有其他div.然后当单击链接2时,可见的div将隐藏,div2将显示.单击链接3时,可见的div将隐藏,div3将显示,依此类推.基本上一次只显示一个div.
我写了这个,但只有当有2个div时它才有效.
$(function () {
$('#link').click(function () {
$('#div1, #div2').toggle();
});
});
但这只会显示隐藏的div并隐藏显示的那个.
好的,我做到了,发现它可以更轻松地完成.这就是我所做的.它不是很优雅,但它的工作原理.
$(document).ready(function () {
$('.slidingDiv').hide();
$('.show_hide').show();
$('.show_hide').click(function () {
$('.slidingDiv').slideToggle();
$('.slidingDiv2').hide('slow');
$('.slidingDiv3').hide('slow');
$('.slidingDiv4').hide('slow');
$('.slidingDiv5').hide('slow');
});
});
$(document).ready(function () {
$('.slidingDiv2').hide();
$('.show_hide2').show();
$('.show_hide2').click(function () {
$('.slidingDiv2').slideToggle();
$('.slidingDiv').hide('slow');
$('.slidingDiv3').hide('slow');
$('.slidingDiv4').hide('slow');
$('.slidingDiv5').hide('slow');
});
});
$(document).ready(function () {
$('.slidingDiv3').hide();
$('.show_hide3').show();
$('.show_hide3').click(function () {
$('.slidingDiv3').slideToggle();
$('.slidingDiv').hide('slow');
$('.slidingDiv2').hide('slow');
$('.slidingDiv4').hide('slow');
$('.slidingDiv5').hide('slow');
});
});
$(document).ready(function () {
$('.slidingDiv4').hide();
$('.show_hide4').show();
$('.show_hide4').click(function () {
$('.slidingDiv4').slideToggle();
$('.slidingDiv').hide('slow');
$('.slidingDiv2').hide('slow');
$('.slidingDiv3').hide('slow');
$('.slidingDiv5').hide('slow');
});
});
$(document).ready(function(){
$('.slidingDiv5').hide();
$('.show_hide5').show();
$('.show_hide5').click(function () …我有一个div我想在点击按钮时显示/隐藏的东西.安排div的是
<div id="someStats">
</div>
<div id="mainContent">
</div>
<div id="someOtherStats">
</div>
,意思是从mainContent我控制是否显示或隐藏两个信息div的左右.这给了我以下问题:不仅fadeToggle()使其中一个div透明,其display属性设置为none,这导致mainContent淡出时的位移someStats.fadeToggle()没有指定两个函数(或拆分函数,如果有),是否有其他选择
if(div.isShown()){
hide()
}else{
show()
}
？或者我可以fadeToggle()以某种方式操纵？
toggle ×10
jquery ×9
html ×3
javascript ×3
fade ×2
button ×1
cleartype ×1
css ×1
flash ×1
hover ×1
if-statement ×1
show-hide ×1
simplebutton ×1