Как добавить текст в свою кнопку прокрутки до верхней кнопки, в которой уже есть значок

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

Попробуйте

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

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

<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>

Demo Here.