addSizes.js 自定标注链接文件的大小
addSizes.js 是一段 JS 代码 , 用于从一个页面里链接的一些大的文件 , 并自动在它们的链接旁边标注文件大小。它的作者是 Nathalie Downe ,应用了 Simon Willison 的 json-head App Engine 迷你服务。
使用它,你的链接不需要额外的代码,它自动会在页面里找到你的链接并更改为这样的格式,如 ” 你的链接 (pdf 2.8 MB)” 。的确很好用!
JAVASCRIPT:
jQuery( function ($) {
$( 'a[href$=".pdf"], a[href$=".doc"], a[href$=".mp3"], a[href$=".m4u"]' ).each( function () {
// looking at the href of the link, if it contains .pdf or .doc or .mp3
var link = $( this );
var bits = this .href.split( '.' );
var type = bits[bits.length -1];
var url= "http://json-head.appspot.com/?url=" +encodeURI($( this ).attr( 'href' ))+ "&callback=?" ;
// then call the json thing and insert the size back into the link text
$.getJSON(url, function (json) {
if (json.ok && json.headers[ 'Content-Length' ]) {
var length = parseInt(json.headers[ 'Content-Length' ], 10);
// divide the length into its largest unit
var units = [
[1024 * 1024 * 1024, 'GB' ],
[1024 * 1024, 'MB' ],
[1024, 'KB' ],
[1, 'bytes' ]
];
for ( var i = 0; i <units.length; i++) {
var unitSize = units[i][0];
var unitText = units[i][1];
if (length>= unitSize) {
length = length / unitSize;
// 1 decimal place
length = Math.ceil(length * 10) / 10;
var lengthUnits = unitText;
break ;
}
}
// insert the text directly after the link and add a class to the link
link.after( ' (' + type + ' ' + length + ' ' + lengthUnits + ')' );
link.addClass(type);
}
} );
} );
} );
分享到:
相关推荐
"china.js 中国及各地js 文件压缩包" 是一个专门针对中国地图数据和ECharts图表库的JavaScript资源集合。这个压缩包包含的核心组件是`china.js`,这可能是一个定制的JavaScript库,用于处理和展示中国地理信息,尤其...
在三维可视化领域,Three.js是一个非常流行的JavaScript库,它允许开发者在Web浏览器中创建和展示复杂的3D模型。本资源是关于使用Three.js处理PCD(Point Cloud Data)模型文件的,这是一种常见的3D点云数据格式。在...
在给定的压缩包"world.js.rar"中,包含了多个与地图和地理数据相关的JavaScript文件。这些文件主要用于在Web应用程序中展示地图,并可能提供交互功能。让我们逐一了解这些文件及其可能包含的知识点。 1. **world.js...
threejs楼栋标注.html
在本文中,我们将深入探讨如何使用Vue.js框架与Konva.js库来实现数据标注功能,特别是绘制和操作矩形及多边形。Vue.js是一种流行的前端JavaScript框架,它提供了组件化开发模式,使得构建可复用和易于维护的用户界面...
jQuery.ipicture.js 是一款强大的JavaScript插件,它允许开发者在网页中的地图上创建标记,并且可以结合图文及链接进行丰富的信息展示。这款插件特别适合用于地理信息系统(GIS)应用,或者任何需要在地图上标注特定...
在使用jQuery Cropper时,首先需要引入jQuery库和插件的JavaScript及CSS文件。接着,通过jQuery选择器找到要应用插件的图片元素,并调用`.cropper()`方法初始化插件。在初始化时,可以设置一系列选项来自定义插件的...
### JS 音频可视化插件 Wavesurfer.js 的使用教程 #### 一、Wavesurfer.js 概述 Wavesurfer.js 是一款强大的基于 HTML5 Canvas 和 WebAudio API 的音频播放器插件,它提供了简洁易用的 API 接口以及高度可定制化的...
1. annotorious.debug.js 和 annotorious.min.js:这是Annotorious的主要JavaScript库,分别提供调试版和优化后的版本。调试版对于开发和调试更有帮助,因为它包含完整的错误信息和代码结构;而min.js则是经过压缩和...
psd.js 是一个用来解析 PhotoShop 的 PSD 文件的 JavaScript 库,支持在浏览器上运行以及 Node.js 环境中使用。 示例代码: {PSD} = require 'psd' psd = PSD.fromFile __dirname '/test.psd' psd.parse() ...
10.4-前端标注辅助工具markman.zip 10.4-前端标注辅助工具markman.zip 10.4-前端标注辅助工具markman.zip 10.4-前端标注辅助工具markman.zip 10.4-前端标注辅助工具markman.zip
本项目名为"Three.js-webgl物联网粮仓3D可视化",是基于WebGL技术的3D可视化管理系统,利用了Three.js库以及Vue.js框架,旨在实现对粮仓的高效管理和监控。通过JavaScript语言进行编程,结合物联网技术,该系统能够...
"three.js"是一个流行的JavaScript库,专门用于在浏览器中进行3D图形渲染,而"photo-sphere-viewer.js"则是一个与three.js结合使用的插件,用于展示全景图像和场景。下面将详细解释这两个技术以及如何在实际项目中...
1. 引入 ECharts 库:在 HTML 文件中添加 `<script>` 标签,链接到 `echarts.min.js` 文件。 2. 准备容器:创建一个 DOM 元素作为图表的容器,例如一个 `<div>` 标签。 3. 初始化 ECharts 实例:使用 `echarts.init...
在实际使用过程中,开发者通常会通过引入SimpleCalendar.js的JavaScript文件,然后调用其提供的API来初始化日历并进行相关设置。例如,可以使用`new SimpleCalendar(options)`创建一个日历实例,并传递一个包含配置...
这些文件可能包含每个省份或城市的坐标信息,以及对应的名称和其他属性,以支持ECharts在绘制地图时正确地定位和标注。 使用ECharts的步骤一般包括以下几个方面: 1. 引入ECharts库:首先在HTML文件中通过 `...
`DrawingManager_min.js`通常会与`DrawingManager_min.css`一起使用,后者是一个样式文件,负责控制绘制工具的外观和交互效果,确保其在不同浏览器和设备上的兼容性和一致性。这两个文件结合使用,能够提供一套完整...
"cixingbiaozhu.rar_中文标注_标注_词性标注"这个项目,显然专注于实现这一功能,通过`cixingbiaozhu.cpp`这个源代码文件,我们可以深入探讨词性标注的原理和应用。 词性标注对于中文文本的理解至关重要,因为它...
1. **安装插件**:首先需要解压"CAD_自动标注.rar",然后根据插件提供的说明文档进行安装,通常涉及到复制插件文件到CAD软件的安装目录或插件文件夹。 2. **启动插件**:在CAD软件中,通过菜单栏、快捷键或者工具栏...
《使用Editor.js添加彩色警报标注的实践指南》 在Web开发中,为文本编辑器添加功能丰富的插件可以极大地提升用户体验。Editor.js是一款现代化的、可扩展的富文本编辑器,它允许开发者通过插件自定义编辑器的功能。...