Skip to content

Instantly share code, notes, and snippets.

@xiongchengqing

xiongchengqing/index.html

Last active April 30, 2020 04:43
Show Gist options
  • Save xiongchengqing/3998c3f16657f72127d4fe573abb63d8 to your computer and use it in GitHub Desktop.
Save xiongchengqing/3998c3f16657f72127d4fe573abb63d8 to your computer and use it in GitHub Desktop.
Download ZIP
multiline-ellipsis
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Multiline Ellipsis</title>
</head>
<body>
<div class="multiline-ellipsis-wrapper">
<span class="multiline-ellipsis-content">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet, aspernatur, sint ut possimus laboriosam quas fugiat quibusdam repellendus eaque totam sed aliquid distinctio ad corporis! Necessitatibus dolor animi iure odio!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet, aspernatur, sint ut possimus laboriosam quas fugiat quibusdam repellendus eaque totam sed aliquid distinctio ad corporis! Necessitatibus dolor animi iure odio!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet, aspernatur, sint ut possimus laboriosam quas fugiat quibusdam repellendus eaque totam sed aliquid distinctio ad corporis! Necessitatibus dolor animi iure odio!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet, aspernatur, sint ut possimus laboriosam quas fugiat quibusdam repellendus eaque totam sed aliquid distinctio ad corporis! Necessitatibus dolor animi iure odio!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet, aspernatur, sint ut possimus laboriosam quas fugiat quibusdam repellendus eaque totam sed aliquid distinctio ad corporis! Necessitatibus dolor animi iure odio!
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet, aspernatur, sint ut possimus laboriosam quas fugiat quibusdam repellendus eaque totam sed aliquid distinctio ad corporis! Necessitatibus dolor animi iure odio!
</span>
<a href="javascript:;" class="multiline-ellipsis-toggle">展开</a>
</div>
<script defer src="./script.js"></script>
</body>
</html>
Raw
playground.json
{
"scripts": [],
"styles": []
}
Raw
script.js
const wrapperDOM = document.querySelector('.multiline-ellipsis-wrapper')
const contentDOM = document.querySelector('.multiline-ellipsis-content')
console.log(1)
Raw
style.css
.multiline-ellipsis-wrapper {
width: 500px;
}
.multiline-ellipsis-content {
}
.multiline-ellipsis-toggle {
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment