Wie erstelle ich einen fließend fließenden Knopf?

Question

Ich habe versucht, eine schwebende Schaltfläche zu erstellen, die immer in der Vision ist, aber durch die Verwendung von jQuery fließend fließt. Ich habe mir dieses Tutorial angesehen, um eines für meine Website zu erstellen. Der Link zum Tutorial ist http://www.wduffy.co.uk/blog/keep-element-in-view-while-scrolling-using-jquery/. Also habe ich alle Schritte gemacht, aber ich weiß nicht, wo ich es vermasselt habe und es funktioniert nicht so, wie ich es wollte.

Bitte lesen Sie den Code-Schnipsel

$().ready(function() { 
 
     var $scrollingDiv = $(".floatBtn"); 
 

 
     $(window).scroll(function(){    
 
      $scrollingDiv 
 
       .stop() 
 
       .animate({"marginTop": ($(window).scrollTop() + 30) + "px"}, "slow");   
 
     }); 
 
    });

.floatBtn{ 
 
    position: absolute; 
 
    float: right; 
 
    right: 0; 
 
    text-align: right; 
 
    z-index: 5; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
 
<p> 
 
Lorem ipsum dolor sit amet, an has dicat aperiri delicata, te maiorum omittantur theophrastus vim, ut quot sapientem reprehendunt eam. Exerci omnium eu eum, legendos explicari sed ad. Apeirian mandamus vix et. Tollit dolorem has at, modus abhorreant mediocritatem an pri. 
 

 
At eos omnes propriae mandamus, has modo denique dignissim ea. Causae dignissim assentior has id. Ei nec exerci eruditi scribentur. Vim regione repudiandae et, mea bonorum fabulas cu. Cum et hinc summo, at vidisse signiferumque ius, nec mucius disputando ea. Ei mei malis virtute facilis, ex dicam indoctum pericula his. 
 

 
An per solet contentiones. Ut posse idque accommodare eam, tation denique dignissim sea ut, at tritani molestie mea. Per possit philosophia in, putant contentiones usu ne, sale tation ius cu. Percipit eloquentiam theophrastus et eum. At nec splendide rationibus delicatissimi, te meis labore consequuntur sea, ne debet sententiae constituam pri. 
 

 
Utamur adipisci sadipscing has ex. Tantas voluptatibus ius ei, vel definiebas signiferumque at. Lorem voluptaria te vel, cum ne consequuntur necessitatibus. Ex suas probo propriae cum. Duo ullum abhorreant dissentiet no. Fuisset consequat vim no. 
 

 
Te atqui eligendi mei. Et his illum elaboraret, dicam tempor euripidis no sea. Id vis postea delicata qualisque, id mea viderer euismod, nam ex laudem interesset. Ea debet pericula sea, laudem patrioque vituperatoribus no duo. Vero simul eleifend sit ei, per ea case insolens. 
 

 
Vim te stet constituto vituperatoribus, est et illud theophrastus. Et utamur quaeque his, ex vix paulo tation doming. Te ius purto deserunt molestiae, te sea fabulas suscipit. His ei quot sententiae interesset, ad sed quem nullam. Soleat deseruisse no mei, et interesset vituperatoribus pri. 
 

 
In vim putent prompta quaestio, eius adversarium eam ea. Cu modo zril suscipiantur eos, propriae intellegat at sea. An sonet pertinacia efficiendi quo, pri enim fuisset an. Ornatus omittam consequat ne qui. Has sale prompta ut, nec elit everti insolens cu. Eu causae appareat deterruisset per, ea eam quod minimum inimicus. 
 

 
Te ius agam consequuntur signiferumque, in usu aeque simul propriae, ea qui ferri audire oporteat. Vim ubique omnesque periculis te, duo diam vocent ornatus ea. Nam in omnes legere euismod, in mei consulatu accommodare. Ei est decore habemus postulant. At sea ludus quando. 
 

 
Reque voluptaria ea usu. Diceret recusabo duo an, eos iusto ocurreret te, no commune vituperatoribus vis. Erat regione moderatius te sea, vis eu sonet altera scribentur. Fastidii repudiandae sea ei. Qui at habemus moderatius disputationi. Eos dico esse dicant eu, liber utamur nec ei. 
 

 
His euismod fastidii in, dolor sensibus repudiare pri ex. Nec wisi adolescens scriptorem in, in liber labitur eos. Id dicant impedit probatus est, ne usu placerat singulis complectitur, duo at antiopam appellantur. Posse civibus accusata eu vel, reque illum incorrupte sit an. Usu in reque verterem adipiscing, eu mel tollit malorum virtute. 
 

 
Ei nec dicam phaedrum expetendis, has fastidii voluptaria deseruisse ea, dolorem inimicus tincidunt at sea. Aliquando interpretaris mel an. Usu veri accusata salutandi eu. In solet numquam vis, eam elit audire regione id. Dolor mandamus posidonium an vel. 
 

 
Alia magna quando an est. An vitae probatus sed, qui movet invenire ocurreret in. Graeci legendos no usu, duo ad doctus disputando ullamcorper, eum vide paulo utroque ad. Qui aperiri consetetur at, possim assentior percipitur sea in. Stet dolorum id sit. 
 

 
Vix ei civibus recusabo, ullum qualisque eu sit, vis ex impetus scripserit. Usu scripta volutpat consectetuer et. Ne sit eros cotidieque, in esse reque nostrud pro, eu periculis adolescens vix. Pri cu libris dolorem eligendi, nam id mucius sanctus. 
 

 
Atqui invenire vim in, no usu possim tractatos principes. Invidunt probatus est te, eos ea error sententiae, id alterum nostrum sea. Mollis moderatius omittantur has ex, falli movet te has. At viris commodo deserunt quo. 
 

 
Eu tale putent referrentur vix, cu quo admodum voluptatum appellantur. Usu ne ignota prodesset, ipsum quando an eos, dolores abhorreant an quo. Cu assum consequat ius, lobortis consequat eos no, ne mea suas congue viderer. Semper latine eripuit in quo. Vel ex dictas accusam abhorreant. Vel aliquando pertinacia omittantur et, duo ei nonumes voluptatibus, eum id scripta convenire. 
 
</p> 
 
<div id="scrollingDiv" class="floatBtn"> 
 
     <a href="signin.php"> 
 
      <img src="http://placehold.it/89x48" style="width: 89px; height: 48px;"></a> 
 
</div>

Wenn u in das sehen kann, wenn man die schwimmenden Taste scrollt nach unten scrollen weiter nach unten statt in der Aufenthaltsbereich betrachtest nicht das, was ich bin Auf der Suche nach. Bitte Hilfe! Vielen Dank im Voraus

Answer 1

Wenn Sie Knopf haben wollen, der immer sichtbar ist, müssen Sie ihn mit der festen Position positionieren. Sie werden dieses Element dann mit dem Ansichtsfenster positionieren, so dass es ständig sichtbar ist. Ich werde dir einige geben (ohne jquery). Übrigens. Verwenden Sie keine jquery für Sachen wie das

.floatBtn{ 
    display: block; 
    position: fixed; 
    width: 200px; 
    height:200px; 
    color: red; 
    border: 3px solid black; 
    top: 20px; 
}