滚动时如何在某些单词下划线？

Question

我正忙于一个网站 here，我想在滚动浏览附件部分时用不同颜色给一些词加下划线。

1 - 我怎样才能达到这样的效果？

2 - 如果我想在滚动时显示一个图标（字体很棒），会不会类似？

感谢

Answer 1

这里有 html 和 js 代码。

.container{
    width: 100%;
    height: 1000px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!DOCTYPE html>
<html> 
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>GETTING STARTED WITH BRACKETS</title>
        <link rel="stylesheet" href="main.css">
        <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
        <script>
            $(document).ready(function(){
              
            });
            $(window).scroll(function(){
                 $("#words").css('text-decoration','underline');
            });
       
       
        </script>
    </head>
    <body>
        <div class="container">
            <p id="words">
                sdfgdsjafaghdf
            </p>
        </div>
        
    </body>
</html>

Answer 2

您可以组合 this and this 以获得正确的结果。

将 :before 元素的选择器更改为：

.parent:hover .hvr-underline-from-left:before

现在这个 CSS 在父项悬停时适用。

JSFiddle

滚动时如何在某些单词下划线？

How to underline some words when scrolling?

html

css

jquery

scroll

underline