我想在Slidediv上放置一个滑块

Question

I want to put this slider in the slideDown() function so that when the text is hovered the slider should come down. 我想将此滑块放在slideDown（）函数中，以便当文本悬停时，滑块应下降。

I have given the code snippet that i was trying to work on, it includes the javascript, css, body. 我已经给出了我要尝试的代码片段，其中包括javascript，css，body。

    <script> 

    var $ = function (id) {
    return document.getElementById(id); 
}


var swapImage = function (){

if($("image1").title=="image1")
{
    $("image1").src="/static/img/new_desserts/two.jpg";
    $("image1").title="image2";
}
else if($("image1").title=="image2")
    {
        $("image1").src="/static/img/new_desserts/teen.jpg";
        $("image1").title="image3";
    } 
else if($("image1").title=="image3")
    {
        $("image1").src="/static/img/new_desserts/some.jpg";
        $("image1").title="image4";
    }
else if($("image1").title=="image4")
    {
        $("image1").src="/static/img/new_desserts/set.jpg";
        $("image1").title="image5";
    }
else if($("image1").title=="image5")
    {
        $("image1").src="/static/img/new_desserts/cake.jpg";
        $("image1").title="image1";
    }
    setTimeout(swapImage, 5000);
}

window.onload = function () {
   /*  $("calculate=").onclick = function(){calculate();} */

   swapImage();
}

$(document).ready(function(){

          $("#prj_1").mouseover(function(){
            $("#image").stop().slideDown("slow");
    });


});
</script>

<style>
            #prj_1{
                position:absolute;
                top:1%;
                left:50%;
                width:1230px;
                height:200px;
                font-family:Andalus;
                font-size:20px;
                color:gold; 
            }
            #image{
                position:absolute;
                top:3%;
                left:25%;
                width:700px;
                height:300px;
                display:none;   
                background-color:red;
            }
</style>

<body>
        <div id="prj_1">AAA Laundry</div>

         <div id="image">
                <img id="image1" src="/static/img/new_desserts/glass.jpg" title="image1" />
        </div>


    </div>

</body>

if i remove the code for slideDown its working but otherwise it not. 如果我删除了slideDown的代码，则无法正常工作，否则无法正常工作。 please help. 请帮忙。

Answer 1

I modified your code a little and used JQuery instead of Javascript, also you used window.onload and $(document).ready which have almost the same purpose. 我稍微修改了代码，并使用JQuery代替了Javascript，还使用了window.onload和$(document).ready ，它们的用途几乎相同。

plz check this demo and see if that's what you wanted:- 请检查这个演示，看看这是否是您想要的：

http://jsfiddle.net/d3rtcyxn/ http://jsfiddle.net/d3rtcyxn/

我想在Slidediv上放置一个滑块

问题描述

1 个解决方案

解决方案1
0 2015-11-12 16:35:30

我想在Slidediv上放置一个滑块

问题描述

1 个解决方案

解决方案1 0 2015-11-12 16:35:30

解决方案1
0 2015-11-12 16:35:30