jquery photoFrame 图片边框美化显示插件


Posted in Javascript onJune 28, 2010

三种样式都是用photoframe实现的,我会继续丰富其样式,目标是拿来即用,简化页面代码。
使用:

<link type="text/css" rel="stylesheet" href="stamp/style.css" /> 
<script type="text/javascript" src="jquery-1.4.2.min.js"></script> 
<script type="text/javascript" src="jquery.photoFrame.js"></script> 
<script type="text/javascript"> 
$(function(){ 
$(".target1").photoFrame(); 
}); 
</script> 
<div class="target1"> 
<img src="images/1.jpg" /> 
</div>

参数
direction : top, bottom, left, right, topLeft, topRight, bottomLeft, bottomRight

目标:
/阴影效果
/顶部banner效果
/邮票效果
毛边相框效果
云朵包围效果

问题(未解决):
上下左右四个图片拉伸效果如何实现?
image解决方案:内置image并设置其width和height
ie解决方案: filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/counter_bg.jpg', sizingMethod='scale'
css3解决方案: ?

在线演示地址http://demo.3water.com/js/jquery.photoFrame/shadow.html
打包下载地址https://3water.com/jiaoben/28010.html

Javascript 相关文章推荐
JavaScript判断DOM何时加载完毕的技巧
Nov 11 Javascript
JQuery实现鼠标滑过显示导航下拉列表
Sep 12 Javascript
基于jquery实现的可编辑下拉框实现代码
Aug 02 Javascript
javascript模拟php函数in_array
Apr 27 Javascript
JS上传组件FileUpload自定义模板的使用方法
May 10 Javascript
element ui里dialog关闭后清除验证条件方法
Feb 26 Javascript
详解JavaScript中的数组合并方法和对象合并方法
May 11 Javascript
jQuery发请求传输中文参数乱码问题的解决方案
May 22 jQuery
Vue 实现复制功能,不需要任何结构内容直接复制方式
Nov 09 Javascript
vue-element-admin 菜单标签失效的解决方式
Nov 12 Javascript
javascript实现倒计时效果
Feb 17 Javascript
详解在IDEA中将Echarts引入web两种方式(使用js文件和maven的依赖导入)
Jul 11 Javascript
使用jQuery.Validate进行客户端验证(初级篇) 不使用微软验证控件的理由
Jun 28 #Javascript
jquery获取ASP.NET服务器端控件dropdownlist和radiobuttonlist生成客户端HTML标签后的value和text值
Jun 28 #Javascript
Jquery ui css framework
Jun 28 #Javascript
Javascript创建Silverlight Plugin以及自定义nonSilverlight和lowSilverlight样式
Jun 28 #Javascript
JavaScript Tips 使用DocumentFragment加快DOM渲染速度
Jun 28 #Javascript
js getElementsByTagName的简写方式
Jun 27 #Javascript
两种简单实现菜单高亮显示的JS类代码
Jun 27 #Javascript
You might like
Laravel学习教程之IOC容器的介绍与用例
2017/08/15 PHP
PHP array_shift()用法实例分析
2019/01/07 PHP
PHP操作路由器实现方法示例
2019/04/27 PHP
在laravel框架中实现封装公共方法全局调用
2019/10/14 PHP
javascript 面向对象全新理练之继承与多态
2009/12/03 Javascript
js 弹出框只弹一次(二次修改之后的)
2013/11/26 Javascript
instanceof和typeof运算符的区别详解
2014/01/06 Javascript
javascript监听鼠标滚轮事件浅析
2014/06/05 Javascript
探讨js字符串数组拼接的性能问题
2014/10/11 Javascript
JS验证邮件地址格式方法小结
2015/12/01 Javascript
浅析AMD CMD CommonJS规范--javascript模块化加载学习心得总结
2016/03/16 Javascript
jQuery制作图片旋转效果
2017/02/02 Javascript
深入浅析Node.js单线程模型
2017/07/10 Javascript
JavaScript实现指定数量的并发限制的示例代码
2020/03/10 Javascript
微信小程序点击item使之滚动到屏幕中间位置
2020/03/25 Javascript
解决vue net :ERR_CONNECTION_REFUSED报错问题
2020/08/13 Javascript
使用vant的地域控件追加全部选项
2020/11/03 Javascript
[01:03:00]DOTA2上海特级锦标赛A组败者赛 EHOME VS CDEC第一局
2016/02/25 DOTA
[00:36]DOTA2上海特级锦标赛 Archon战队宣传片
2016/03/04 DOTA
[00:31]2016完美“圣”典风云人物:国士无双宣传片
2016/12/04 DOTA
[53:15]2018DOTA2亚洲邀请赛3月29日 小组赛A组 KG VS OG
2018/03/30 DOTA
Pandas 数据框增、删、改、查、去重、抽样基本操作方法
2018/04/12 Python
python求最大连续子数组的和
2018/07/07 Python
在Pycharm中修改文件默认打开方式的方法
2019/01/17 Python
Flask中endpoint的理解(小结)
2019/12/11 Python
html5 touch事件实现触屏页面上下滑动(一)
2016/03/10 HTML / CSS
在网上学习全世界最好的课程:Coursera
2017/11/07 全球购物
ORLY官网:美国专业美甲一线品牌
2019/12/11 全球购物
试述DBMS的主要功能
2016/11/13 面试题
学生学习总结的自我评价
2013/10/22 职场文书
优秀员工自荐书
2013/12/19 职场文书
专题组织生活会方案
2014/06/15 职场文书
争先创优公开承诺书
2014/08/30 职场文书
2015年小学开学寄语
2015/02/27 职场文书
2015秋季开学典礼致辞
2015/07/16 职场文书
68行Python代码实现带难度升级的贪吃蛇
2022/01/18 Python