为什么可以'；我不能在Jquery中设置100%宽度的动画吗？

我试图为其他人回答一个问题，但我遇到了来自jquery的奇怪/意外行为。如果我将JSFIDLE中规则18中指定的宽度更改为100%，则该宽度将无法设置动画（在本例中，顺便说一句，它是200px，因此请将其更改为100%，以了解我所说的内容）。我需要这是100%，使按钮自动适合文本

问题是：“如何使动画具有100%的宽度？”

Jquery代码：

$(document).ready(function(){
    $(".ScrollDownArrow").click(function(){
        if($(".ScrollDownArrow").hasClass("Clicked")){
           $(".Hint img").fadeOut(500); 
           $(".Hint p").delay(500)/*wait on fadeout*/.animate({width: 200} /*Unfortunately width: 100% does not seem to work so I took a px value :(*/, 1000).animate({opacity:1}, 500); 
           $(".ScrollDownArrow").removeClass("Clicked");
        }else{
           $(".Hint p").animate({opacity:0.01}/*fade p out without making its width disappear for the width animation*/, 500).animate({width: 0}, 1000);
           $(".Hint img").delay(1500).fadeIn(500);
           $(".ScrollDownArrow").addClass("Clicked");
        }
    }); // End Click
});//End Ready 

---

问题是您在

a

中放置了

div

元素（

.Hint

）

JQuery设置的“100%”是元素的父元素的宽度（即

a

的宽度）

默认情况下，锚元素是内联元素（即css中的

display

属性最初设置为

inline

）。因此，锚点的宽度为

auto

---

要修复它，请将锚点的宽度设置为100%，或者将其

显示属性设置为
块
我自己想出了一个解决方法。通过在页面加载变量时保存宽度，然后稍后使用此变量将“p”返回到其原始大小，我可以稍后使用此变量将div返回到其原始大小


$(document).ready(function(){
    var ButtonWidth = parseInt($(".Hint p").width());
    $(".ScrollDownArrow").click(function(){
        if($(".ScrollDownArrow").hasClass("Clicked")){
           $(".Hint img").fadeOut(500); 
           $(".Hint p").delay(500)/*wait on fadeout*/.animate({width: ButtonWidth} /*Unfortunately width: 100% does not seem to work so I took a px value :(*/, 1000).animate({opacity:1}, 500); 
           $(".ScrollDownArrow").removeClass("Clicked");
        }else{
           $(".Hint p").animate({opacity:0.01}/*fade p out without making its width disappear for the width animation*/, 500).animate({width: 0}, 1000);
           $(".Hint img").delay(1500).fadeIn(500);
           $(".ScrollDownArrow").addClass("Clicked");
        }
    }); // End Click
});//End Ready

这并不能解释为什么我不能将动画设置为100%/自动。这就是为什么我现在不回答这个问题。
当你使用100%时，你是否将100%用引号括起来？对我来说很好。确保将百分比放在引号之间：
{width:'100%}
@Kippie您在提供的小提琴上试过吗？它不起作用，所以是其他原因导致了问题。锚已经应用了display:block。将锚定宽度设置为100%将使按钮变大。我希望按钮有一个宽度，使其适合段落内部（不多，也不少）。@RMo所以您真正想要的是。@Juhana是的，auto可能是一个更合适的值。但是仍然不起作用。