JSFiddle - React, Tailwind, and code Playground
by secretgspot
HTML
<script>
$(document).ready(function () {
$('#wardrobe').easyAccordion({
autoStart: false
});
$(".floater").fixposition();
});
/**
* Enables an element to be fixed in position within a specified bounding element.
* Usage: $("#myElementToBeFixed").fixposition();
* Provide a data structure with the following elements if you want to override the defaults:
* boundingElement - the element to limit the fixed position within
* bottomOffset - the amount to bufferhe fixed element from the bottom (of the specified bounding element)
* $myDiv.fixposition({boundingElement:myBoundary}) //myBoundary is the element you want your scrolling div to remain within.
*/
(function($) {
$.extend($.fn, {
fixposition: function(opts) {
return this.each(function() {
var defaults = {
boundingElement: "create-new-look",
bottomOffset: 20
};
var options = defaults;
if (typeof(options) != 'object') options = { };
options = $.extend(options, opts);
$this = $(this);
var $boundEl = $("#" + options.boundingElement);
var bottomBound = $boundEl.offset().top + $boundEl.height();
var maxTop = bottomBound - $this.height() - options.bottomOffset;
var minTop = $this.offset().top;
var newTopPos = null;
var parentTopOffset = $this.parent().offset().top;
if($("body").length > 0 && options.boundingElement != "") {
$(window).scroll(function () {
var scrollY = $(window).scrollTop();
if($this.length > 0) {
if ($this.offset().top != (scrollY - parentTopOffset)) {
newTopPos = scrollY - parentTopOffset;
}
if (newTopPos != null) {
if...