当前位置：网站首页>Expand and collapse too high div

Expand and collapse too high div

2022-06-26 10:42:00 【MervynLammm】

Insert picture description here 

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css"> .contentDiv {
      width: 300px; } .hideDiv {
      display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; } </style>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
</head>
<body>
<div>
    <div class="contentDiv hideDiv">
        Kubernetes One of the core features is the ability to manage containers independently to ensure that containers in the cloud platform run according to the expected state of users （ For example, users want to make apache Has been running , Users don't need to care about how to do ,Kubernetes Will automatically monitor , Then go and restart , newly build , All in all , Give Way apache Always provide services ）, Administrators can load a microservice , Let the planner find the right place , meanwhile ,Kubernetes It also improves the tools and humanization of the system , So that users can easily deploy their own applications （ It's like canary deployments）.
    </div>
    <a href="javascript:;" class="showHideA">[ Expand all ]</a>
</div>
<script type="text/javascript"> $(".showHideA").on("click", function() {
      var contentDiv = $(".contentDiv"); if (contentDiv.hasClass("hideDiv")) {
      contentDiv.removeClass("hideDiv"); $(this).text("[ Retract ]"); } else {
      contentDiv.addClass("hideDiv"); $(this).text("[ Expand all ]"); } }); </script>
</body>
</html>
原网站

版权声明
本文为[MervynLammm]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/02/202202170529156305.html

边栏推荐

猜你喜欢

随机推荐