Question

我对这个领域很陌生，所以请帮助我。

我几乎尝试了所有事情，但似乎没有任何工作。实际上，我想在我的滚动到顶部按钮中添加一些文本，该按钮已经完成并且工作正常，并且其中有一个图标。但我想用该图标添加一些文字。这是a link我想做的事情！

以下是我在js文件中的代码：

// Append Button
$("body").append($("<a />")
        .addClass("scroll-to-top")

            .attr({
                "href": "#",
                "id": "scrollToTop"
                            })
        .append(
            $("<i />")
            .addClass("icon icon-chevron-up icon-white")
    ));

我应该在上面的代码文件中还是在我的页面代码中添加文本？

任何形式的帮助都将受到赞赏。

提前致谢。

Answer 1

尝试以下操作。

$("body").append($("<a />")
    .addClass("scroll-to-top")

        .attr({
            "href": "#",
            "id": "scrollToTop"
                        })
    .append(
        $("<i>Scroll</i>")
        .addClass("icon icon-chevron-up icon-white")
));

Answer 2

试试这个

＆＃13;

$(document).ready(function () {
				
				$(window).scroll(function () {
					if ($(this).scrollTop() > 100) {
						$('.scrollup').fadeIn();
						} else {
						$('.scrollup').fadeOut();
					}
				});
				
				$('.scrollup').click(function () {
					$("html, body").animate({
						scrollTop: 0
					}, 600);
					return false;
				});
				
			});

＆＃13;

/* CSS used here will be applied after bootstrap.css */
.scrollup {
	width: 250px;
	height: 40px;
	position: fixed;
	bottom: 10px;
	right: 10px;
	display: block;
	text-align:center;
	vertical-align:middle;
	background-color: #6BAFBD;
	border:1px solid #6BAFBD;
	border-radius:10px;
	color:#fff;
}
.scrollup .middle{
	margin:12px;
}
.scrollup:hover{
	background-color: #BD8D6B;
	border:1px solid #BD8D6B;
	color:#000;
}

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.css" rel="stylesheet">
<a href="#" class="scrollup">Back To Top<i class = "fa fa-chevron-up middle"></i></a>

＆＃13;

演示Here。

如何在滚动到顶部按钮中添加文本，其中已有一个图标

2 个答案: