js控制图片宽高比例 js控制图片尺寸防止撑破页面布局.防止过大图片撑破页面.
代码中的 650 表示最大宽度,根据自己情况适当修改;article_content 表示图片外层容器的Id,需要你修改为自己的.兼容各浏览器,最主要的是不跟其他js库冲突,放上去就能用.
<script type="text/javascript">
function ImgZoom(Id)
{
var w = Id.width;
var m = 650;
if(w < m)
{
return;
}
else
{
var h = Id.height;
Id.height = parseInt(h*m/w);
Id.width = m;
}
}
void function(){
var Imgs = document.getElementById("article_content").getElementsByTagName("img");
for(i=0;i<Imgs.length;i++)
{
ImgZoom(Imgs[i]);
}
}();
</script>
本代码在
http://www.k686.com/ 上测试使用正常.
分享到:
相关推荐
漂亮的网站整站源码30个【DIV控制布局+华丽的JS特效】 30个漂亮的网站源码 所有网站都采用CSS控制样式展现,没有table,都是DIV控制布局!更有一些网站有华丽丽的JS特效。 36个网站中包含了各行各业的网页设计,譬如...
js等比例缩放图片,这个功能非常实用,当网页加载一个尺寸比较大的图片时,往往会把一个网页撑的变形,页面变得很难看,于是我们就想到了用JS去控制超出一定范围的图片,软件开发网以稳定页面布局,本代码段就是完成...
FlexImages 是一款轻量级的 ...通过CSS控制图片间距,可灵活调整。完整显示图片,不会裁剪图片,也不会打乱图片顺序。支持无限滚动支持图片和iframe内容懒加载可随意控制布局显示行数 标签:FlexImages
jQuery鼠标控制图片滚动翻页是一款jquery.gridnav网格图片列表排列布局鼠标按钮控制图片滚动翻页。
相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空间,到底部时,会动态加载剩余的说说或者是日志 ...
未使用jquery,Mootools等Js框架,核心使用JavaScript实现,用CSS美化布局并控制元素,最终效果如Flash菜单一样,看上去动感十足,适合于黑色风格的主题网站,如果色调不适合你,你只需替换顶部图片以及修改CSS样式表...
(3)针对页面自适应问题,本文结合渐进增强以及拥抱流式布局的思想,同时研究利用了移动设备的视口特性,实现跨分辨率、跨设备的页面自适应。 (4)针对系统的功能实现问题,通过结合利用原生态框架与HTML5的跨平台...
HTML5全屏图片左右滑动轮播代码是一款全屏响应式图片轮播布局,按钮控制图片水平滑动预览查看,图片支持鼠标悬停文字动画展示特效。
源码使用CSS属性+原生js代码实现图片轮播切换、图片整体跟随鼠标移动效果、图片整体鼠标滚轮控制缩放,使用的css属性包括:弹性盒布局元素居中、背景图片平铺尺寸设置、相对、绝对定位、滤镜效果、图片层级、边距...
13. jQuery仿新浪新闻图片浏览器(支持鼠标左右滚动控制图片切换) 14. jquery仿苏宁易购商城产品图片全方位展示功能 15. jquery制作漂亮按钮示例打包 16. jQuery动态切换网页背景的大块图片的导航栏代码 17. ...
全屏图片视差切换Anime.js插件是一款全屏响应式的图片元素布局,通过左右按钮控制图片视差旋转切换效果。
1.3.3 控制图片 1.3.4 CSS的注释 第2章 CSS的基本语法 2.1 CSS选择器 2.1.1 标记选择器 2.1.2 类别选择器 2.1.3 ID选择器 2.2 选择器声明 2.2.1 集体声明 2.2.2 选择器的嵌套 2.3 ...
1.2 使用CSS控制页面 1.3 体验CSS 第2章 CSS的基本语法 2.1 CSS选择器 2.2 选择器声明 2.3 CSS的继承 第3章 用CSS设置丰富的文字效果 3.1 CSS文字样式 3.2 文字实例一:模拟...
73. 一款jQuery插件slide幻灯片切换图片宽高自适应 74. 一款jQuery漂亮淡出淡入焦点大图切换源码 75. 一款jquery缩略图商品切换放大展示功能插件 76. 一款使用jQuery左右控制横向图片滚动的代码 77. 一款基于...
她支持多皮肤共存,这些皮肤的背景图片在页面载入时就会被缓存好,调用时几乎感觉不到延时。 细致的用户体验 她支持Esc快捷键关闭;如果对话框内容有输入控件她将支持Ctrl+Enter提交;智能给按钮添加焦点;小对话框...
js游戏人物上下左右跑步效果是一款jquery ui制作的点击按钮网格布局头像图片动画切换特效。
1.2 使用CSS控制页面 1.3 体验CSS 第2章 CSS的基本语法 2.1 CSS选择器 2.2 选择器声明 2.3 CSS的继承 第3章 用CSS设置丰富的文字效果 3.1 CSS文字样式 3.2 文字实例一...
最近做站要用这个效果,效果不错。主要是css布局,js控制。
/js/all.js JavaScript脚本文件 /images 图片文件 第24章(/ch24) 程序描述:本章将使用Ajax技术实现无刷新即可浏览RSS的阅读器。添加一个RSS地址时,自动保存到数据库。打开阅读RSS时,自动获取...
在前端开发中,会涉及到一些重要的前端技术栈,如vue.js、react.js、node.js、前端安全、react-native等。同时,也需要借助一些工具,如代码编辑工具(WebStorm、VS Code)、代码版本控制工具(Git、SVN)、代码包...