在JQuery中滚动到时，元素会向下滑动

Question

I'd like to have an opacity:0 element slide down when it is in the viewport. I'm currently able to have it fade in when it is scrolled to, because the prerequisite for the jquery code to work is to have the opacity as 0. https://jsfiddle.net/agreyfield91/5c0raLp9/

In my jfiddle, I'm trying to do this:

$("#SlideDownOnScroll").css(
            "opacity": "1";
            "display":"none").slideDown("fast");

In order to first convert the display aspect needed to slideDown, but it isn't working. Is there a better way to achieve what I'm doing, or a way to fix it?

Answer 1

It looks like the css argument has incorrect syntax:

$("#SlideDownOnScroll").css({
        "opacity": "1",
        "display":"none"
  }).slideDown("fast");

In the fiddle you linked the jQuery selector is missing the # in the selector. $("#SlideDownOnScroll")