Day16:小前端

回到顶部

<style type="text/css">
body {
 height: 8000px;
}
h1 {
 color: #000;
}
img {
position: fixed;
bottom: 50px;
right: 50px;
width: 150px;
height: 195px;
display: none;
z-index: 100;
}
</style>

<img src="img/gotop.gif"/>

<script>
$(function(){
$(window).scroll(function(){
var sTop = $(window).scrollTop(); 
if (sTop >= 500) {
 $("img").fadeIn();
}else{
$("img").fadeOut()
}
})

$("img").click(function(){
$("body, html").animate({ scrollTop: 0}), 500)
})

</script>
image

Web Strom

image

VS Code

image

HBuilder

image

Sublime

image

ATOM

EasyUI简介
easyui是一种基于jQuery的,角,Vue公司和阵营的用户界面插件集合。

easyui为创建现代化,互动,JavaScript的应用程序,提供必要的功能。

使用easyui你不需要写很多代码,你只需要通过编写一些简单的HTML标记,就可以定义用户界面。

easyui是个完美支持HTML5网页的完整框架。

easyui节省您网页开发的时间和规模。

easyui很简单但功能强大的。

轻松使用EasyUI

<div class="easyui-dialog" style="width:400px;height:200px"
    data-options="
        title:'My Dialog',
        iconCls:'icon-ok',
        onOpen:function(){}">
    dialog content.
</div>
<input id="cc" style="width:200px" />

$('#cc').combobox({
    url: ...,
    required: true,
    valueField: 'id',
    textField: 'text'
});
<template>
  <div>
  <DIV>
    <h2>Basic Accordion</h2>
    <h2>基本手风琴</ h2>
    <Accordion style="height:250px">
    <Accordion style =“height:250px”>
      <AccordionPanel :title="'Title1'">
      <AccordionPanel:title =“'Title1'”>
        <p>Content1</p>
        <P>内容1 </ P>
      </AccordionPanel>
      </ AccordionPanel>
      <AccordionPanel :title="'Title2'">
      <AccordionPanel:title =“'Title2'”>
        <p>Content2</p>
        <P>内容2 </ P>
      </AccordionPanel>
      </ AccordionPanel>
      <AccordionPanel :title="'Title3'">
      <AccordionPanel:title =“'Title3'”>
        <p>Content3</p>
        <P> Content3 </ P>
      </AccordionPanel>
      </ AccordionPanel>
    </Accordion>
    </手风琴>
  </div>
  </ DIV>
</template>
</模板>

<script>
<SCRIPT>
export default {};
export default {};
</script>
</ SCRIPT>
image.png

请点赞!因为你的鼓励是我写作的最大动力!

官方微信公众号

吹逼交流群:711613774

吹逼交流群

推荐阅读更多精彩内容