使用jquery将div按钮设置为更大的菜单

时间:2016-08-09 19:02:30

标签: jquery html css

我正在尝试制作一个菜单按钮,当你点击它时它会变得更大并且它使用jquery中有菜单项但是由于某种原因它只是在这里消失了我在这里使用它的jquery是页面我遇到了麻烦

billischill.ddns.net/testroom.php

$(document).on("click", "#addtomsg", function(){
    $('#addtomsg').addClass('open');
})

这是我的风格

#addtomsg.open{
    width: 80px;
    height: 80px;
   }
#addtomsg p{
    margin-top:3px;
   }
#addtomsg{
    position: fixed;
    float: left;
    margin-left:30px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    border:none;
    width: 40px;
    height:20px;
    background:#006666;
   }

这是我的HTML

</div>

<form name="message" id="fixedinput"action="">
<div name="addtomsg" id="addtomsg">
  <center>
  <p>+<p>
  </center>
</div>
    <input name="usermsg" type="text" id="usermsg" size="73"class="textinpt" />
    <input name="submitmsg" type="submit"  id="submitmsg" value="Send" class="submit2"/>
</form>
</div>

有人可以帮助我吗

3 个答案:

答案 0 :(得分:0)

您的代码完全独立于此。如果你在控制台上没有错误,并且你正确地导入了jQuery,那么除非你分享整个事情,否则我们无法确定错误。

如果您想在评论中说明可切换,请将addClass替换为toggleClass,它会为您提供所需的结果。

$(document).on("click", "#addtomsg", function(){
    $('#addtomsg').toggleClass('open');
})

答案 1 :(得分:0)

$("#addtomsg").click(function(){   
    $(this).toggleClass('open');
})
#addtomsg.open{
    width: 80px;
    height: 80px;
   }
#addtomsg p{
    margin-top:3px;
   }
#addtomsg{
    position: fixed;
    float: left;
    margin-left:30px;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    border:none;
    width: 40px;
    height:20px;
    background:#006666;
  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form name="message" id="fixedinput"action="">
<div name="addtomsg" id="addtomsg">
  <center>
  <p>+<p>
  </center>
</div>
  <br>
  <br>
    <input name="usermsg" type="text" id="usermsg" size="73"class="textinpt" />
    <input name="submitmsg" type="submit"  id="submitmsg" value="Send" class="submit2"/>
</form>

答案 2 :(得分:0)

也许这可能会有所帮助

WITH CTE AS(
    SELECT rownum = ROW_NUMBER() OVER(ORDER BY p.BusinessEntityID),
    p.FirstName FROM Person.Person p
)
SELECT
prev.FirstName PreviousValue,
    CTE.FirstName,
    nex.FirstName NextValue
FROM CTE
LEFT JOIN CTE prev ON prev.rownum = CTE.rownum - 1
LEFT JOIN CTE nex ON nex.rownum = CTE.rownum + 1
GO

我不是最好的jquery还在学习,但它是一些东西。