精华内容
下载资源
问答
  • 每天学一个jquery插件-图片书签

    千次阅读 2021-02-11 19:01:05
    每天学一个jquery插件-图片书签

    每天一个jquery插件-做图片书签

    做图片书签

    新年快乐,马上准备看春晚了,所以今天的笔记有点水,就是图片的书签效果,一个约定的效果

    效果如下
    在这里插入图片描述

    代码部分

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title>做图片书签</title>
    		<script src="js/jquery-3.4.1.min.js"></script>
    		<style>
    			*{
    				margin: 0px;
    				padding: 0px;
    			}
    			#div{
    				border: 1px solid lightgray;
    				width: 95%;
    				height: 400px;
    				margin: 20px auto;
    			}
    			.sqimg{
    				width: 100%;
    				height: 100%;
    				z-index: 2;
    			}
    			.sqdiv{
    				overflow: hidden;
    				position: relative;
    			}
    			.sqtxt{
    				width: 100%;
    				height: 100%;
    				background-color: rgba(0,0,0,0.5);
    				position: absolute;
    				z-index: 3;
    				top:100%;
    				color: white;
    				text-indent: 24px;
    			}
    		</style>
    	</head>
    	<body>
    		<div id="div" class="sqdiv">
    			<img src="img/1.png" class="sqimg"/>
    			<div class="sqtxt">这是一段介绍</div>
    		</div>
    	</body>
    </html>
    <script>
    	$(function(){
    		$(".sqdiv").mouseenter(function(){
    			var that = $(this);
    			that.children(".sqtxt").stop().animate({
    				"top":"0px"
    			},500)
    		})
    		$(".sqdiv").mouseleave(function(){
    			var that = $(this);
    			that.children(".sqtxt").stop().animate({
    				"top":"100%"
    			},500)
    		})
    	})
    </script>
    
    

    新年快乐!

    展开全文
  • 无聊用html一个书签,效果图 代码截图
    无聊用html做了一个书签,效果图
    代码截图

    展开全文
  • 打算做个书签助手

    2015-03-03 11:16:17
    做一个能同步不同平台下不同浏览器书签的助手,申请个云平台来存同步文件。 申请API权限,先是百度云,N天了还是权限对接中,不能忍... 所以申请金山的

    做一个能同步不同平台下不同浏览器书签的助手,申请个云平台来存同步文件。

    申请API权限,先是百度云,N天了还是权限对接中,不能忍...

    所以申请金山的

    展开全文
  • RT,比如说csdn.net,将他保存到书签之后,通过书签打开的话连接后面会多加一个参数 ?ref=toolbar,这个参数有什么用?
  • css3的一个书签

    2019-09-30 17:39:55
    1.css3的transform属性制作一个标签页,没浏览器兼容 <!doctype html> <html> <head> <title>HTML5 NOTE DEMO</title> <meta charset="utf-8"> <script src=...

    1.css3的transform属性制作一个标签页,没做浏览器兼容

    <!doctype html>
    <html>
    <head>
    <title>HTML5 NOTE DEMO</title>
    <meta charset="utf-8">
    <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
    <style>
    html{
        background:#ccc;
    }
    body{
        font: 12px normal "微软雅黑";
    }
    .wrap{
        width:100%;
        height:auto;
        margin:0 auto;
    }
    
    .note{
        margin:0 0 20px 0;
        padding:0;
        list-style:none;
        overflow:hidden;
    }
    
    .note li{
        width:100px;
        height:100px;
        margin:30px 0 0 33px;
        background:#000;
        float:left;
        box-shadow:3px 4px 11px #000;
    }
    
    .note li h3{
        height:20px;
        margin:0;
        padding:0;
        color:white;
        border-bottom:1px solid dashed;
        background:#def;
    }
    </style>
    </head>
    
    <body>
    
    <h1> Html5 Notes !!</h1>
    <h4>@author:luowen<br/>@time:2014-02-21</h4>
    <hr/>
    <div class="wrap">
        <ul class="note">
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
            <li><h3>note 1</h3>this is note 1.Yes You are right!</li>
    
        </ul>
    </div>
    <script>
    //init note deg
    $(function(){
            $(".note li").each(function(){
                switch($(this).index()%5){
                case 0:
                $(this).css({"transform":"rotate(20deg)","background":"blue"});
                /* $(this).css({"transform":"rotate(20deg)","background":"blue","-webkit-transform":"rotate(20deg)","-ms-transform":"rotate(20deg)","-moz-transform":"rotate(20deg)"}); 做兼容ff,chrome IE */
                break;
                case 1:
                $(this).css({"transform":"rotate(-30deg)","background":"yellow"});
                break;
                case 2:
                $(this).css({"transform":"rotate(40deg)","background":"pink"});
                break;
                case 3:
                $(this).css({"transform":"rotate(-20deg)","background":"red"});
                break;
                case 4:
                $(this).css({"transform":"rotate(30deg)","backgrond":"green"});
                break;
                case 5:
                $(this).css({"transform":"rotate(-50deg)","background":"#abcdef"});
                break;
                }
            });
    });
    </script>
    </body>
    </html>
    

      

    转载于:https://www.cnblogs.com/luowen/p/3559630.html

    展开全文
  • Eclipse遇到过的一些问题,做一个汇总,不想再保存书签了 Eclipse新的工作空间如何完全复制已存在工作空间的配置 Eclipse注释模板设置详解 eclipse修改默认注释 整理MAC下Eclipse的常用快捷键 eclipse插件大全 如何...
  • 如果有需要的话,我可以给大家分享下这插件原理 源代码下载地址:[url=http://download.csdn.net/detail/bosstwobread/7171427]http://download.csdn.net/detail/bosstwobread/7171427[/url]
  • 实用网络书签-登陆前(左栏放了一个广告,留空不好看).png   实用网络书签-登陆后(左栏是自己的分类,没有广告碍眼).png   功能类似百度书签,多了favicon.ico ,识别更快更方便。 如果你也喜欢这样的...
  • 采撷一片阳光 生命中的书签--国旗下的讲话 采撷一片阳光 生命中的书签--国旗下的讲话 亲爱的xx: 上周的大课间活动,我校为在xx首届校园广播体操视频比赛中获得荣誉称号的班级,颁发了奖状及奖品。...
  • 报表基本上在每一个项目中占有很大的比例,报表也是我们开发人员必须过的坎,现在市面上各种类型的报表,我们到底应该如何选择呢?每一种报表都有他自己优秀的一面,我在项目开发中,一般用Grid++Report报表,...
  • 窗口是一个Chrome扩展程序,旨在提供一种更有效的方式来查看和管理书签菜单: Firefox / IE之类的书签菜单 将鼠标放在文件夹上以将其打开 键入时搜索书签 做书签管理器可以的事情以及更多操作(例如,按名称对...
  • CU中关于网站架构的贴子,先做一个书签,在慢慢的琢磨去吧! http://bbs.chinaunix.net/forum/13/050217/497040.html http://bbs.chinaunix.net/forum/viewtopic.php?t=428204&amp;show_type=new&amp;...
  • 为什么要源泉书签

    2015-03-31 22:10:49
    关键字: 网络书签,网络收藏夹,云书签,同步书签,书签同步,同步收藏夹,收藏夹同步,在线书签,在线收藏夹,源泉书签,...在大学里面,由于经常重装系统,备份收藏夹是一个家常便饭。后来自然想到有没有网络书签,那时候还很
  • 做一个有心人

    2019-10-04 20:37:42
    在理解 索引这块的时候,想到 有了聚集索引以及非聚集索引的表上面,如果 select list 或者 filter list 里没有这些列,那么还是会要通过 非聚集索引查找到行然后 利用 聚集索引 进行书签查找。怎样避免这问题呢...
  • 玩手工四年了,终于下定决心要做一枚古琴书签。因为对古琴不了解,想尽全力模仿整个斫琴的过程,于是在网上恶补了斫琴的过程视频,包括查阅故宫博物院馆藏古琴的资料。最后决定仿制中唐时期,神农式“大圣遗音”古琴...
  • 反正小编是不到的,有好几次都因为不知道阅读到哪里了而重新看遍,为了方便寻找阅读的位置,小编决定给PDF文件添加书签,下面来分享添加的方法,有需要的可以起来学习!小编制作书签使用的是迅捷PDF编辑器,...
  • 报表基本上在每一个项目中占有很大的比例,报表也是我们开发人员必须过的坎,现在市面上各种类型的报表,我们到底应该如何选择呢?每一种报表都有他自己优秀的一面,我在项目开发中,一般用Grid++Report报表,...
  • 前言 相信大家在逛技术论坛或者技术博客的...但是我们平时浏览的站点肯定不止一个,并且有时候一些个人的技术博客并没有这样的功能,我们就只能存浏览器书签这样了,这样我们平时保存下来的一些文章就会比较分散...
  • 为什么80%的码农都不了架构师?>>> ...
  • OpenCV-Python-Toturial-官方教程中文版,网上大多数并不带有书签,这样想定位到某一个部分还得一点一点的翻,在此自做书签,方便快速定位,查找自己想要的函数。
  • 10强大的书签

    2010-10-21 18:37:00
    SEO的外链资本很主要,以前给人人引荐过一些,此次首要引荐一些常用的珍藏夹资本,引荐的首要是些比拟高质量的,当然目前珍藏夹远远不止...百度珍藏夹还具有一个特殊适用的功用:快照。即便珍藏的网站打不开了,...
  • 报表基本上在每一个项目中占有很大的比例,报表也是我们开发人员必须过的坎,现在市面上各种类型的报表,我们到底应该如何选择呢?每一种报表都有他自己优秀的一面,我在项目开发中,一般用Grid++Report报表,...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 774
精华内容 309
关键字:

做一个书签