Skip to content

Instantly share code, notes, and snippets.

<div id="app">
<section class="theme-list">
<div class="fixed-nav" ref="fixednav">
<div class="fixed-nav-content">
<p
v-for="(item, index) in theme"
:key="index"
:class="['tab-title', activeId === index && 'select-tab']"
@click="changeTab(index, $event)"
@edward1986
edward1986 / index.html
Created June 23, 2021 15:18
【JAVASCRIPT】three-level link of year, month and day
<div>
<select id="year"></select> year
<select id="month" onchange="initDate()"></select> month
<select id="date"></select>
</div>
@edward1986
edward1986 / index.html
Created June 18, 2021 16:08
simple tab bar switching case
<div class="vertical-tab" id="app">
<!-- Nav tabs -->
<ul class="nav nav-tabs1">
<li v-on:click='change(index,0)' :class='currentIndex==index?"active":""' v-if="index < list.length/2" v-for="(item, index) in list"><a href="#" rel="external nofollow" rel="external nofollow" > {{item.title}} </a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content tabs">
<div class="tab-pane fade" :class='currentIndex==index?"active":""' :key='item.id' v-for='(item, index) in list'>
<h3>{{item.title}}</h3>
<p>{{item.content}}</p>
<div id="app">
<div :style="{position: !distance ? 'absolute' : 'initial', height:distance + 'px'}" class="pull_refresh d-flex ai-center jc-center">
<p class="text-center text-gray p-2 text" v-if="pullStatus !==2">{{pullTexts[pullStatus]}}</p>
<van-loading size="24px" v-else>{{pullTexts[pullStatus]}}</van-loading>
</div>
<div class="home p-2" @touchstart="touchStart" @touchend="touchEnd" @touchmove="touchMove"></div>
</div>
@edward1986
edward1986 / index.html
Created June 11, 2021 02:33
Vue Draggable Resizable
<div style="width: 400px; height: 600px; position: relative;">
<template v-for="(element, index) in elements">
<vue-draggable-resizable style="background-color: #332c2b;" :parent="true" :resizable="true" :x="element.x" :y="element.y" :w="element.w" :h="element.h" style="border: 1px solid" @activated="onActivate(element, index)" @deactivated="onDeactivate(element, index)" @resizing="onResize" @dragging="onDrag">
</vue-draggable-resizable>
</template>
</div>
<!DOCTYPE html>
<html>
<head>
<base target="_blank">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Registration</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic|Material+Icons"/>
<link rel="stylesheet" href="https://unpkg.com/vue-material/dist/vue-material.min.css"/>
<link rel="stylesheet" href="https://unpkg.com/vue-material/dist/theme/default.css"/>
[
{
"showCorrect": true,
"questionTag": "Question: 2",
"question": "Which is the best framework for app development?",
"rightAnswer": "Flutter",
"wrongAnswers": ["Fluttor", "Flitter"]
}
]
[
{
showCorrect: true,
questionTag: "Question: 2",
question: "Which is the best framework for app development?",
rightAnswer: "Flutter",
wrongAnswers: ["Fluttor", "Flitter"],
}
]