- js+css 锚点菜单
bobringtheboys
javascriptcss开发语言
{{item.label}}我是内容1我是内容2我是内容3我是内容4我是内容5exportdefault{name:"",components:{},mixins:[],props:{},computed:{},watch:{},data(){return{//初始化菜单navList:[{label:"菜单1",},{label:"菜单2",},{label:"菜单3",},{label:"菜单
- js+css制作导航栏下划线跟随动画,App+H5点击效果
千叶KE
vuecssjavascript
2023.2.7更新这个做法有很多缺陷,有其他更好的解决方案,已经更新在新文章里了,感兴趣的朋友可以去新文章里看↓js+css制作导航栏下划线跟随动画,自适应元素尺寸变化,自定义下划线样式,Vue/Uniapp_千叶KE的博客-CSDN博客导航栏下划线跟随动画,自适应元素尺寸变化,自定义下划线样式https://blog.csdn.net/qq1219579255/article/details/
- js+css制作导航栏下划线跟随动画,自适应元素尺寸变化,Vue/Uniapp
千叶KE
javascriptvue.jscss
以前也写过一个差不多的,但上一个写的存在很多问题,尤其是css要使用justify-content:space-around才能正常计算下滑宽度,导致了在很多场景都不实用,其实那一天就想到更好的解决办法了,但是因为懒......就一直没更新文章......最终效果图↓1.使用Vue制作一个没有动画的初始导航栏HTML代码{{item}}JS代码exportdefault{data(){return
- JS和CSS实现的原生轮播图
她说她一如既往的爱我
javascriptcss开发语言
JS+CSS实现滑动轮播图使用JS加CSS来实现的幻灯片,主要使用的是CSS的transform属性中的translate来实现,适合与用户交互的轮播图,展现轮播图的数量,用户可自由进行选择。Document*{margin:0;padding:0;list-style:none;}.cardBox{width:600px;height:300px;box-shadow:0010pxgray;bo
- 秋招面试总结
秀秀的奇妙旅行
#前端面试题目汇总面试+科研的总结前端面试vue.js1024程序员节
一、第一次面试刚结束自己的第一个面试,来记录一下这次面试的体验以及需要加强的部分面试前边会根据你的项目提一些问题,比如我用的vue,那开始肯定要提问你vue的问题,所以vue必须要好好掌握一下,而且肯定会结合项目来的(权限管理之类的)后边就直接提问js+css的一些内容(面试官肯定直接根据列的题目提纲问了,这边没啥问题,当然也要防止他再回去结合项目问,)最后还问了对自己的工作有什么期望(提升前端技
- Taro+vue3+NutUI实现微信小程序的购物车功能
BSCIO_599
vuetypescripthtmlcss
这个功能主要是使用原生的标签+js+css实现的,目前在项目中属于定制化开发,后期可以考虑封装成组件,简单的记录一下 {{item?.name}}{{getDistance(item?.positionLatitude,item?.positionLongitude,state.currentLat,state.currentLon)}} {{item?.name}}物资数量{{item?.q
- 制作简易计算器(js+css)
黑糖厚乳拿铁
javascriptcss开发语言
实现效果:实现功能:+-*/Document*{margin:0;padding:0;outline:none;}body{background-color:#bdbdbd}.container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;height:800px;background-co
- js+css实现颜色选择器
PHP隔壁老王邻居
htmljsjavascriptcss开发语言
颜色选择器.color-box{width:50px;height:50px;border:1pxsolid#000;cursor:pointer;}提交varcolorBox=document.querySelector('.color-box');varcolorValue=document.querySelector('#color-value');colorBox.addEventList
- JS+CSS音量条
亿个小目标
VolumeBar.all{width:500px;height:80px;margin:100pxauto;position:relative;}.bar{width:500px;height:20px;border-radius:10px;background:#aaa;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;cu
- VUE开发一个组件——Vue list列表滑动删除
web秀
前言滑动删除,在很多APP软件里面可以见到,比如淘宝的订单列表,QQ微信的聊天记录等等,今天就来看看JavaScript是如何实现这个功能的,之所以说是vue,主要是框架是vue啦,主要还是JS+CSS部分。VUE开发一个组件——Vuelist列表滑动删除页面部分页面就超级简单咯,遍历一个列表,添加touchstart和touchend事件,并添加删除按钮。如果滑动就添加move类样式,向左滑动6
- js+css实现简单轮播图效果
weixin_47510624
htmlhtmljavascriptcss
js+css实现简单轮播图效果首先把基本轮播图的界面和样式写好12345>>css样式如下`:*{margin:0;padding:0;}#box{width:500px;height:300px;position:relative;margin:20pxauto;}.bt{width:50px;height:70px;background-color:rgba(0,0,0,0.2);positi
- 滑动门套滑动门css,JS+CSS实现带小三角指引的滑动门效果
凉凉不凉
滑动门套滑动门css
本文实例讲述了JS+CSS实现带小三角指引的滑动门效果。分享给大家供大家参考。具体如下:这是一款JS+CSS带小三角指引的滑动门,有朋友说在IE6下看不到效果,其实能看到,因为那个小三角颜色比较淡,有时候因显示器的原因看不太清,其实这个颜色是自己可以控制的,改一下就行了,带三角指引后,使整个滑动门的结构更清淅,导向性更合理。运行效果截图如下:在线演示地址如下:具体代码如下:/p>"http://w
- js+css实现两个dom元素之间的连线
喯啵儿灞
前端jscssjqueryhtml
刷论坛时,看到有小伙伴提问不依赖图形化工具,怎么实现两个div之间的连线,看着追问的人不少,顺题发挥了下,下面代码实现两个dom元素中心坐标的连线,首先引入jquery(任意版本),主要是为了方便dom操作,当然改成原生js也可以Document.item{height:100px;width:200px;position:absolute;z-index:2;}#one{background:r
- js+css实现进度条
海阔天空BM
CSS3JSjs+css实现进度条css3jshtml5
其实实现进度条的方法最简单的就是先定义好这个标签的背景颜色这样容易区分,还要设置好高端,一开始宽度为0,随之宽度的增宽进度条也会随之变长。.propess{backgroundColor:skyblue;height:10px;width:0;}如果想体验更好一些,让进度条有一个外边框,则需要在这个标签外层在包围一层div,给外层的div,设置好边框颜色,这个div的宽度设置的要跟进度条最长的宽度
- 使用原生JS+CSS或HTML5实现简单的进度条和滑动条效果(精问)
weixin_34248118
前端数据结构与算法后端ViewUI
使用原生JS+CSS或HTML5实现简单的进度条和滑动条效果(精问)一、总结一句话总结:进度条动画效果用animation,自动效果用setIntelval二、使用原生JS+CSS或HTML5实现简单的进度条和滑动条效果前言我个人非常喜欢js+css的强大表现能力,这也是我喜欢前端开发的原因之一,后端通常都是在和数据打交道,很多东西都是抽象的数据结构,不直观也不美观,而前端着重于界面视图的渲染以及
- JS+CSS随机点名详细介绍复制可用(可自己添加人名)
远近高低各不同
javascriptcss开发语言
想必大家也想拥有一个可以随机点名的网页,接下来我为大家介绍一下随机点名,可用于抽人,哈哈*{margin:0;padding:0;}.box{width:850px;/*我固定死了高度如果需要修改黑色背景的高度请修改这部分*/height:1000px;background-color:black;margin:0auto;position:relative;}.box>div{width:200
- html+手机端+遮掩层,纯js+css遮挡层Demo
Alysa其诗闻
html+手机端+遮掩层
*{margin:0;padding:0;list-style-type:none;}a,img{border:0;}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:998;width:100%;height:100%;_padding:020px00;background:#f6f4f5;display:none;}.s
- 【web实现右侧弹窗】JS+CSS如何实现右侧缓慢弹窗动态效果『附完整源码下载』
拄杖盲学轻声码
web页面开发-源码demoCSS前端开发前端javascriptcss
文章目录写在前面涉及知识点页面效果1、页面DOM创建1.1创建底层操作dom节点1.2创建存放弹窗dom节点2、页面联动功能实现(关闭与弹出)2.1点击非右侧区域实现关闭2.2点击叉叉及关闭按钮实现关闭功能3、完整源码包下载3.1百度网盘3.2123云盘3.3邮箱留言总结写在前面已经一个月没有更新博文了,过了个国庆公司也忙了,后面尽量控制更新频率,其实之前我写过一个类似的文章,但是还是觉得当时做的
- Js+Css 制作简易柱状图
一位不愿透露姓名的大英俊
收藏css函数图片javascript
fei={jsimg:{}}fei.jsimg.histogram=function(x,y,data){this.width=800;//图片宽度this.height=300;//图片高度this.barwidth=50;//柱子宽度this.x=x||[1,2,3,4,5,6];//x轴刻度this.y=y||["ZB1","ZB2","ZB3","ZB4","ZB5","ZB6"];//y
- js+css实现磨砂效果制作
马奇德德
周记生活小玩意儿javascriptcss开发语言
一直很喜欢新海诚的作品,前几天又温故了一遍《天气之子》,还是会被阳莱和帆高的故事感动。效果图:废话少说,直接上代码html部分天气之子{现在开始天晴了相比于蓝天,我更想选择阳莱一起勇敢地爱下去}遇见你css(scss)部分body{display:flex;justify-content:center;align-items:center;margin:0;padding:0;width:100v
- JS+CSS实现长文本中间省略效果(文件名中间省略但不省略后缀名)
洛千陨
vue.js前端javascript
文本中间省略1.纯CSS实现原博客:https://juejin.cn/post/6966042926853914654目的:文件名过长时中间省略但不省略文件后缀实现关键:txt元素为不需要省略情况,即长度不需要换行,title元素为需要省略情况。利用相对定位,当txt元素不需要换行时,title元素在视图内;当txt元素需要换行时,title元素进行覆盖。title元素利用浮动将内容拆成两端,在
- 前端实现轮播图的三种方法。
李现分现
html前端js前端javascriptcss
轮播图,作为前端学习的经典案例,涉及了各种知识点,包括动画函数,js基础知识以及逻辑思路等,一辈子只做一次。下面总结实现轮播图的三种方法,从易到难,大家选择性学习。轮播图一、Vue.js实现轮播图二、js+css实现轮播图(移动端)index.htmlimgcssindex.cssjsindex.js三、纯js实现轮播图(动画函数)index.htmlcssindex.cssimgjsindex.
- Vue中js+css鼠标悬停拖动、移动小图片,大图片也移动
我就是DaLing呀!
鼠标移动vuejs图片移动
效果图:页面代码://主要显示的大图片//右下角小图//鼠标移动的图层记得在data中定义变量url(图片路径)css:#box_BigImg{width:70%;height:95%;position:relative;margin:autoauto;box-shadow:3px3px10px0#111111;/*给图片施加阴影效果*/}.leftcon{width:170px;height:1
- JS+CSS实现内凹导航栏
倾斜的水瓶座
CSSjavascriptcss导航栏
在移动互联网时代,导航栏是一个非常重要的元素,它能够帮助用户快速找到所需的信息。下面使用JS+CSS实现一个内凹导航栏,内凹导航栏则是一种比较流行的设计风格,它能够让导航栏看起来更加立体和美观,视觉效果也非常不错。这个内凹导航栏比较个性化,可以在微信小程序中,使用自定义导航栏功能,实现内凹导航栏。实际效果下面一步一步实现内凹导航栏创建一个html纯CSS实现内凹导航栏引入字体文件字体文件使用的是i
- 【Java Web基础】(十三)侧边菜单导航(JS+CSS)
passer__jw767
JavaWeb基础
效果图是这样的:JSP:SideBarNavProblemsAProblemsa1problemsa2problemsa3problemsa4problemsa5problemsa6problemsa6problemsa6problemsa6problemsa6problemsa6problemsOtherBProblemsa1problemsa2problemsa3problemsa4probl
- 【Html】js+css实现平滑滚动
少莫千华
语言-JavaScript语言-HTMLhtmljavascriptcss
效果示例Documentbutton{bottom:0;position:fixed;z-index:999;left:0;background:rgb(94,171,255);border:1pxred;color:white;font-size:large;font-family:'';}img{position:relative;cursor:not-allowed;width:100%;h
- js实现表格首行首列固定滑动
请叫我大豆包
前端H5js
js+css实现table首行首列的冻结效果。这个方案是把表格分为4块,首行首列不可滑动,利用onscroll动态根据内容设置冻结首行首列内容。html左上左上首列首列首行标题首行标题首行标题内容内容内容jsvarright_div2=document.getElementById("right_div2");right_div2.onscroll=function(){varright_div2
- 使用JS+CSS的网易云轮播图的实现(完整代码)
willwe
一个网易云轮播图的实现Document/*一些简单的初始化文件*/*{margin:0;padding:0;}a{text-decoration:none;}li{list-style-type:none;}/*更改图片的大小*/img{width:100%;border-radius:20px;box-shadow:5px5px5pxrgba(0,0,0,0.2);}/*确定盒子的大小*/.bo
- 关于this和$(this)的使用问题
会写代码的心理师
C#
最近要做一个js+css动画效果,大体效果就是一张图片,点击的时候就让他匀速运动到页面最上方,然后把这个图片自己删除。反复尝试了很多次,发现this和$(this)有时候会用混,导致很多效果不方便处理。this得到的是一个html,你可以直接对他使用style改变样式。$(this)得到的是一个jquery对象,你可以使用addclass直接添加样式,然后remove()直接删除自己。我最后的JS
- js+css实现简单的弹框动画
ps酷教程
前端学习cssjavascriptcss3
效果图只是一个简单的演示demo,但是可以后面可以优化样式啥的刚开始元素的display为none,然后,为了给元素展示时添加一个动画,首先要添加样式类名show,让它覆盖display:none,变得可见。然后,添加元素放大的动画样式类名隐藏的时候,也需要有动画,并且动画结束完成之后,元素的display应当恢复成原来的none,也就是变得不可见。因此,需要监听动画完成事件。Document/*
- 基本数据类型和引用类型的初始值
3213213333332132
java基础
package com.array;
/**
* @Description 测试初始值
* @author FuJianyong
* 2015-1-22上午10:31:53
*/
public class ArrayTest {
ArrayTest at;
String str;
byte bt;
short s;
int i;
long
- 摘抄笔记--《编写高质量代码:改善Java程序的151个建议》
白糖_
高质量代码
记得3年前刚到公司,同桌同事见我无事可做就借我看《编写高质量代码:改善Java程序的151个建议》这本书,当时看了几页没上心就没研究了。到上个月在公司偶然看到,于是乎又找来看看,我的天,真是非常多的干货,对于我这种静不下心的人真是帮助莫大呀。
看完整本书,也记了不少笔记
- 【备忘】Django 常用命令及最佳实践
dongwei_6688
django
注意:本文基于 Django 1.8.2 版本
生成数据库迁移脚本(python 脚本)
python manage.py makemigrations polls
说明:polls 是你的应用名字,运行该命令时需要根据你的应用名字进行调整
查看该次迁移需要执行的 SQL 语句(只查看语句,并不应用到数据库上):
python manage.p
- 阶乘算法之一N! 末尾有多少个零
周凡杨
java算法阶乘面试效率
&n
- spring注入servlet
g21121
Spring注入
传统的配置方法是无法将bean或属性直接注入到servlet中的,配置代理servlet亦比较麻烦,这里其实有比较简单的方法,其实就是在servlet的init()方法中加入要注入的内容:
ServletContext application = getServletContext();
WebApplicationContext wac = WebApplicationContextUtil
- Jenkins 命令行操作说明文档
510888780
centos
假设Jenkins的URL为http://22.11.140.38:9080/jenkins/
基本的格式为
java
基本的格式为
java -jar jenkins-cli.jar [-s JENKINS_URL] command [options][args]
下面具体介绍各个命令的作用及基本使用方法
1. &nb
- UnicodeBlock检测中文用法
布衣凌宇
UnicodeBlock
/** * 判断输入的是汉字 */ public static boolean isChinese(char c) { Character.UnicodeBlock ub = Character.UnicodeBlock.of(c);
- java下实现调用oracle的存储过程和函数
aijuans
javaorale
1.创建表:STOCK_PRICES
2.插入测试数据:
3.建立一个返回游标:
PKG_PUB_UTILS
4.创建和存储过程:P_GET_PRICE
5.创建函数:
6.JAVA调用存储过程返回结果集
JDBCoracle10G_INVO
- Velocity Toolbox
antlove
模板toolboxvelocity
velocity.VelocityUtil
package velocity;
import org.apache.velocity.Template;
import org.apache.velocity.app.Velocity;
import org.apache.velocity.app.VelocityEngine;
import org.apache.velocity.c
- JAVA正则表达式匹配基础
百合不是茶
java正则表达式的匹配
正则表达式;提高程序的性能,简化代码,提高代码的可读性,简化对字符串的操作
正则表达式的用途;
字符串的匹配
字符串的分割
字符串的查找
字符串的替换
正则表达式的验证语法
[a] //[]表示这个字符只出现一次 ,[a] 表示a只出现一
- 是否使用EL表达式的配置
bijian1013
jspweb.xmlELEasyTemplate
今天在开发过程中发现一个细节问题,由于前端采用EasyTemplate模板方法实现数据展示,但老是不能正常显示出来。后来发现竟是EL将我的EasyTemplate的${...}解释执行了,导致我的模板不能正常展示后台数据。
网
- 精通Oracle10编程SQL(1-3)PLSQL基础
bijian1013
oracle数据库plsql
--只包含执行部分的PL/SQL块
--set serveroutput off
begin
dbms_output.put_line('Hello,everyone!');
end;
select * from emp;
--包含定义部分和执行部分的PL/SQL块
declare
v_ename varchar2(5);
begin
select
- 【Nginx三】Nginx作为反向代理服务器
bit1129
nginx
Nginx一个常用的功能是作为代理服务器。代理服务器通常完成如下的功能:
接受客户端请求
将请求转发给被代理的服务器
从被代理的服务器获得响应结果
把响应结果返回给客户端
实例
本文把Nginx配置成一个简单的代理服务器
对于静态的html和图片,直接从Nginx获取
对于动态的页面,例如JSP或者Servlet,Nginx则将请求转发给Res
- Plugin execution not covered by lifecycle configuration: org.apache.maven.plugin
blackproof
maven报错
转:http://stackoverflow.com/questions/6352208/how-to-solve-plugin-execution-not-covered-by-lifecycle-configuration-for-sprin
maven报错:
Plugin execution not covered by lifecycle configuration:
- 发布docker程序到marathon
ronin47
docker 发布应用
1 发布docker程序到marathon 1.1 搭建私有docker registry 1.1.1 安装docker regisry
docker pull docker-registry
docker run -t -p 5000:5000 docker-registry
下载docker镜像并发布到私有registry
docker pull consol/tomcat-8.0
- java-57-用两个栈实现队列&&用两个队列实现一个栈
bylijinnan
java
import java.util.ArrayList;
import java.util.List;
import java.util.Stack;
/*
* Q 57 用两个栈实现队列
*/
public class QueueImplementByTwoStacks {
private Stack<Integer> stack1;
pr
- Nginx配置性能优化
cfyme
nginx
转载地址:http://blog.csdn.net/xifeijian/article/details/20956605
大多数的Nginx安装指南告诉你如下基础知识——通过apt-get安装,修改这里或那里的几行配置,好了,你已经有了一个Web服务器了。而且,在大多数情况下,一个常规安装的nginx对你的网站来说已经能很好地工作了。然而,如果你真的想挤压出Nginx的性能,你必
- [JAVA图形图像]JAVA体系需要稳扎稳打,逐步推进图像图形处理技术
comsci
java
对图形图像进行精确处理,需要大量的数学工具,即使是从底层硬件模拟层开始设计,也离不开大量的数学工具包,因为我认为,JAVA语言体系在图形图像处理模块上面的研发工作,需要从开发一些基础的,类似实时数学函数构造器和解析器的软件包入手,而不是急于利用第三方代码工具来实现一个不严格的图形图像处理软件......
&nb
- MonkeyRunner的使用
dai_lm
androidMonkeyRunner
要使用MonkeyRunner,就要学习使用Python,哎
先抄一段官方doc里的代码
作用是启动一个程序(应该是启动程序默认的Activity),然后按MENU键,并截屏
# Imports the monkeyrunner modules used by this program
from com.android.monkeyrunner import MonkeyRun
- Hadoop-- 海量文件的分布式计算处理方案
datamachine
mapreducehadoop分布式计算
csdn的一个关于hadoop的分布式处理方案,存档。
原帖:http://blog.csdn.net/calvinxiu/article/details/1506112。
Hadoop 是Google MapReduce的一个Java实现。MapReduce是一种简化的分布式编程模式,让程序自动分布到一个由普通机器组成的超大集群上并发执行。就如同ja
- 以資料庫驗證登入
dcj3sjt126com
yii
以資料庫驗證登入
由於 Yii 內定的原始框架程式, 採用綁定在UserIdentity.php 的 demo 與 admin 帳號密碼: public function authenticate() { $users=array( &nbs
- github做webhooks:[2]php版本自动触发更新
dcj3sjt126com
githubgitwebhooks
上次已经说过了如何在github控制面板做查看url的返回信息了。这次就到了直接贴钩子代码的时候了。
工具/原料
git
github
方法/步骤
在github的setting里面的webhooks里把我们的url地址填进去。
钩子更新的代码如下: error_reportin
- Eos开发常用表达式
蕃薯耀
Eos开发Eos入门Eos开发常用表达式
Eos开发常用表达式
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
蕃薯耀 2014年8月18日 15:03:35 星期一
&
- SpringSecurity3.X--SpEL 表达式
hanqunfeng
SpringSecurity
使用 Spring 表达式语言配置访问控制,要实现这一功能的直接方式是在<http>配置元素上添加 use-expressions 属性:
<http auto-config="true" use-expressions="true">
这样就会在投票器中自动增加一个投票器:org.springframework
- Redis vs Memcache
IXHONG
redis
1. Redis中,并不是所有的数据都一直存储在内存中的,这是和Memcached相比一个最大的区别。
2. Redis不仅仅支持简单的k/v类型的数据,同时还提供list,set,hash等数据结构的存储。
3. Redis支持数据的备份,即master-slave模式的数据备份。
4. Redis支持数据的持久化,可以将内存中的数据保持在磁盘中,重启的时候可以再次加载进行使用。
Red
- Python - 装饰器使用过程中的误区解读
kvhur
JavaScriptjqueryhtml5css
大家都知道装饰器是一个很著名的设计模式,经常被用于AOP(面向切面编程)的场景,较为经典的有插入日志,性能测试,事务处理,Web权限校验, Cache等。
原文链接:http://www.gbtags.com/gb/share/5563.htm
Python语言本身提供了装饰器语法(@),典型的装饰器实现如下:
@function_wrapper
de
- 架构师之mybatis-----update 带case when 针对多种情况更新
nannan408
case when
1.前言.
如题.
2. 代码.
<update id="batchUpdate" parameterType="java.util.List">
<foreach collection="list" item="list" index=&
- Algorithm算法视频教程
栏目记者
Algorithm算法
课程:Algorithm算法视频教程
百度网盘下载地址: http://pan.baidu.com/s/1qWFjjQW 密码: 2mji
程序写的好不好,还得看算法屌不屌!Algorithm算法博大精深。
一、课程内容:
课时1、算法的基本概念 + Sequential search
课时2、Binary search
课时3、Hash table
课时4、Algor
- C语言算法之冒泡排序
qiufeihu
c算法
任意输入10个数字由小到大进行排序。
代码:
#include <stdio.h>
int main()
{
int i,j,t,a[11]; /*定义变量及数组为基本类型*/
for(i = 1;i < 11;i++){
scanf("%d",&a[i]); /*从键盘中输入10个数*/
}
for
- JSP异常处理
wyzuomumu
Webjsp
1.在可能发生异常的网页中通过指令将HTTP请求转发给另一个专门处理异常的网页中:
<%@ page errorPage="errors.jsp"%>
2.在处理异常的网页中做如下声明:
errors.jsp:
<%@ page isErrorPage="true"%>,这样设置完后就可以在网页中直接访问exc