Question

如果可以使用JQuery实现如何使用JQuery加载下面的部分？

这是网站：http://www.scottradke.com/new-gallery-1

右下方有一个链接，您可以使用该链接加载底部。虽然我可以使用起点，但我还没有尝试任何东西。： - ）

Answer 1

这是一个简单的幻灯片动画，可以使用.slideToggle（）在jQuery中轻松实现。您可以在此处详细了解：http://api.jquery.com/slidetoggle/

＆＃13;

class ExampleAdapter(private var button: Button, private var arrayList: ArrayList<SimpleString>) : RecyclerView.Adapter<ExampleAdapter.ViewHolder>() {

    inner class ViewHolder(view: View) : RecyclerView.ViewHolder(view) {
        val text = view.findViewById<TextView>(R.id.textView)!!
        val layout = view.findViewById<LinearLayout>(R.id.layout)!!
    }

    override fun onBindViewHolder(viewHolder: ExampleAdapter.ViewHolder, position: Int) {
        val currentPosition = position
        viewHolder.text.text = arrayList[position].text

        viewHolder.text.setOnClickListener {
            button.isEnabled = true
            button.setOnClickListener {
                  viewHolder.layout.background = ... //set color here
                  notifyItemChanged(position)
            }
        }


    }

    override fun onCreateViewHolder(viewGroup: ViewGroup, i: Int): ExampleAdapter.ViewHolder {
        val view = LayoutInflater.from(viewGroup.context).inflate(R.layout.your_item_layout, viewGroup, false)

        return ViewHolder(view)
    }

    override fun getItemCount(): Int {
        return arrayList.size
    }

}

＆＃13;

$("button").click(function() {
  $("p").slideToggle("slow");
});

＆＃13;

p {
  width: 400px;
}

＆＃13;

Answer 2

＆＃13;

/*QuickReset*/
*{margin:0;box-sizing:border-box;}html,body{height:100%;font:14px/1.4 sans-serif;}

#panel {
  position: fixed;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-height: 100vh;
  bottom: 0;
  z-index: 10;
  background: #cfcfff;
}

#panel-toggler {
  display: block;
  padding: 20px;
}

#panel-content {
  position: relative;
  overflow-y: scroll;
  transition: 1s;
  max-height: 0;
}

#panel-checkbox:checked+#panel #panel-content {
  max-height: 100vh;
}

＆＃13;

<input hidden type="checkbox" id="panel-checkbox">

<div id="panel" class="hide">

  <label id="panel-toggler" for="panel-checkbox">
    Click to slide toggle
  </label>

  <div id="panel-content">
    <p style="border:4px dashed #000; height:200vh;">Tall P to force scrollbars</p>
  </div>

</div>

＆＃13;

如何使用JQuery或任何其他技术加载底部部分

2 个答案: