欢迎各位兄弟 发布技术文章

这里的技术是共享的

shiping1 的头像

使用jquery给img绑定error事件的问题

星期二, 2013-08-13 14:42 — shiping1 
如：
<img src = 'xxxx.jpg' >

$('img').error(function(){
    $(this).attr('src',"默认图片");
})

经过测试发现，如果原始图片不存在的话，页面上的图片就会一直闪烁，如何解决这个问题？

 

没太懂，原始图片是指xxxx.jpg吗?你这个代码如果默认图片路径也是错误的话（也就是默认图片也不存在）就进入死循环了，所以一直闪啊闪，因为不断的onerror

 

先检查图片是否加载成功，然后如果失败的话再绑定事件。而且替换一次就好了。

普通分类: 
jquery
shiping1 的头像

判断图片是否完全加载的方法(jquery的error事件妙用)

星期二, 2013-08-13 14:39 — shiping1

判断图片是否完全加载的方法(jquery的error事件妙用)

          页面上，如何判断图片是否完全加载？

          有时候，当用js动态获取服务器图片的时候，可能图片在服务器是不可用状态，这是需要重新获取。但是在页面，用什么方法判断图片是否完全加载了呢？期间LZ尝试了多种方法，最后得到了一种比较合理的方案。

         因为，在jQuery中有一个error事件,可以通过绑定图片的error事件来监听图片是否完全加载。

$(document).ready(function() { 

        $('#pbcimg').error(function(){ 

普通分类: 
jquery
shiping1 的头像

jQuery 事件 - load() 方法

星期二, 2013-08-13 14:32 — shiping1

jQuery 事件 - load() 方法

jQuery 事件参考手册

实例

当图像加载时，改变 div 元素的文本：

$("img").load(function(){
  $("div").text("Image loaded");
});

亲自试一试

定义和用法

当指定的元素（及子元素）已加载时，会发生 load() 事件。

该事件适用于任何带有 URL 的元素（比如图像、脚本、框架、内联框架）。

根据不同的浏览器（Firefox 和 IE），如果图像已被缓存，则也许不会触发 load 事件。

普通分类: 
jquery
shiping1 的头像

jquery gallery 相册效果

星期二, 2013-08-13 14:20 — shiping1

google jquery gallery

http://www.cnblogs.com/lhb25/p/responsive-jquery-gallery-with-css3-animations.html

http://www.w3cplus.com/source/72-jQuery-slider-show.html

http://www.cnblogs.com/lhb25/archive/2012/12/11/jquery-image-slide-effect.html

普通分类: 
jquery
shiping1 的头像

简单图片的onload事件实现图片预加载 这个好像不太好

星期二, 2013-08-13 10:10 — shiping1

做过图片翻转效果的朋友其实都知道，要让图片轮换的时候不出现等待，最好是先让 图片下载到本地，让浏览器缓存起来。这时，一般都会用到js里边的Image对象。一般的手段无非这样：

function preLoadImg(url) {
	var img = new Image();
	img.src = url;
}

通过调用preLoadImg函数，传入图片的url，就能使图片预先下载下来了。

实际上，这里用到的预下载功能也和这基本一致。图片预下载下来后，通过 img的width和height属性，就能知道图片的宽和高了。但是需要考虑到，在做图片浏览器功能时，图片都是实时显示的。比如你点了显示的按钮，这 个时候才会调用上边类似的代码来加载图片。因此，如果你直接用img，width的时候，图片还没有完全下载下来。

因此，需要用一些异步的方法，等到图片 下载完毕的时候才会再对img的width和height进行调用。实现这样的异步方法实际上不难，图片的下载完毕事件也很简单，就是简单的onload事件。因此，我们可以写出下面的代码：

普通分类: 
javascript
shiping1 的头像

在jQuery 1.5中使用deferred对象

星期二, 2013-08-13 09:14 — shiping1

三生石上

Make Difference - Javascript, Ajax, jQuery, ExtJS, Asp.Net, C#, Object-C

普通分类: 
jquery
shiping1 的头像

通过$.Deferred 实现判断N个图片加载完毕逻辑

星期二, 2013-08-13 09:06 — shiping1

 

JavaScriptImagejqueryDeferred图片加载判断

     最近，图片分享的兴起，关于图片的JS效果也多了起来，比如自动缩放、自动排版等

普通分类: 
javascript
shiping1 的头像

image的加载事件(onload)和加载状态(complete)

星期二, 2013-08-13 09:04 — shiping1

image的加载事件(onload)和加载状态(complete)

(2012-05-23 10:20:11)
转载▼
标签：

普通分类: 
javascript
shiping1 的头像

加载中进行等待图像的技术

星期二, 2013-08-13 08:26 — shiping1

<div class="rg-image-wrapper">        
   <div class="rg-image-nav">   
    <a style="display: block; width: 50%; cursor: url('/templets/default/images/move-prev-next/bg11.cur'), auto; height: 100%; outline: medium none;" class="rg-image-nav-prev" href="#">Previous Image</a>    
   <a style="display: block; width: 50%; cursor: url('/templets/default/images/move-prev-next/bg12.cur'), auto; height: 100%; outline: medium none; " class="rg-image-nav-next" href="#">Next Image</a>         
     </div>

普通分类: 
javascript
shiping1 的头像

图像在div 内垂直居中 绝对ok 纯CSS实现图片水平垂直居中于DIV（图片未知宽高）

星期一, 2013-08-12 19:27 — shiping1

一个问题一直困扰着不少前端制作人员（也称前端开发工程师，o(∩_∩)o）。如题，如何实现一张未知宽高的图片在一个Div里面水平垂直 居中呢？相信部分前端Sir首先想的是Table布局，是的，实现起来不是很麻烦，但肯定也有和浩子一样有代码洁癖的人。在这里，浩子忽略Table的实 现方法，有兴趣的也可以去研究一下。下面介绍下用Html和CSS来实现如题效果。

先看看Demo效果：纯CSS实现图片水平垂直居中于DIV（图片未知宽高）

PS：你可以用Firebug或者任意浏览器的开发人员工具修改图片尺寸，测试测试效果。（任何关于本文的问题请留言）

再看看代码，主要2部分：

普通分类: 
div+css
shiping1 的头像

图像在div 内垂直居中

星期一, 2013-08-12 19:17 — shiping1 
1)一种方法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312" />
<title>无标题文档</title>
<style type="text/css">
.psdthumb { height: 1%; overflow: hidden; display:table; border-spacing:10px; }
普通分类: 
div+css
shiping1 的头像

图像加载完毕前 显示 等待的图像

星期一, 2013-08-12 18:28 — shiping1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
img{
width:980px;
height:350px;
background:loading.gif;
}
</style>
<body>

普通分类: 
div+css
shiping1 的头像

用JS 判断图片已经加载完成(兼容IE 和 Firefox)

星期一, 2013-08-12 18:22 — shiping1

js 判断图片已经加载完成 是一个很常见的问题，网上也有很多的解决方案。但是运行后很多都不兼容，或者
说，存在一些奇怪的问题。一种解决方案是都用onload。因为onload 在ie 下有同步方面的问题。
所以，我用了 onreadystatechange 。 代码和 使用方法如下：

 

普通分类: 
javascript
shiping1 的头像

JS判断img图片是否加载完成

星期一, 2013-08-12 18:16 — shiping1

function isImgLoad(){
 

普通分类: 
javascript
shiping1 的头像

网站挂马的概述

星期一, 2013-08-12 09:39 — shiping1

很多朋友都碰到过这样的现象：打开一个网站，结果页面还没显示，xp系统下载的杀毒软件就开始报警，提示检测到木马病毒。

　　网站挂马的概述

　　有经验的朋友会知道这是网页恶意代码，但是自己打开的明明是正规网站，没有哪家正规网站会将病毒放在自己的网页上吧?那么，是什么导致了这种现象的发生呢?其中最有可能的一个原因就是：这个网站被挂马了。

普通分类: 
其它
shiping1 的头像

Web安全：基础知识学习之Web安全百问百答

星期一, 2013-08-12 09:37 — shiping1

Web安全：基础知识学习之Web安全百问百答

1、什么叫Web应用系统?

　 　答：Web应用系统就是利用各种动态Web技术开发的，基于B/S(浏览器/服务器)模式的事务处理系统。用户直接面对的是客户端浏览器，使用 Web应用系统时，用户通过浏览器发出的请求，其之后的事务逻辑处理和数据的逻辑运算由服务器与数据库系统共同完成，对用户而言是完全透明的。运算后得到 的结果再通过网络传输给浏览器，返回给用户。比如：ERP系统、CRM系统以及常见的网站系统(如电子政务网站、企业网站等)都是Web应用系统。

　　2、Web威胁为什么难以防范

　　答：针对Web的攻击已经成为全球安全领域最大的挑战，主要原因有如下两点：

　　1. 企业业务迅速更新，需要大量的Web应用快速上线。而由于资金、进度、意识等方面的影响，这些应用没有进行充分安全评估。

普通分类: 
其它
shiping1 的头像

Linux下查看mysql、apache是否安装,并卸载

星期一, 2013-08-12 08:56 — shiping1

1,mysql 的守护进程是mysqld

如果已经安装则:

[root@localhost ~]# service mysqld start
启动 MySQL：                                               [确定]

如果没有安装则:

[root@localhost ~]# service mysqld start
mysqld:未被识别的服务

你可以看看你的服务是否已经添加到linux上

[root@localhost ~]# chkconfig --list mysqld
mysqld          0:关闭  1:关闭  2:关闭  3:关闭  4:关闭  5:启用  6:关闭


没有安装则:

普通分类: 
linux
shiping1 的头像

wap 手机发短信代码 有大用

星期一, 2013-08-12 08:55 — shiping1

下面这个是发短信绝对ok的代码
<a href="sms:13777774519">移动WEB页面JS一键发送短信咨询功能</a>

 

<a href="sms:10000?body=sssss">开通挂机短信 </a>




短信例子
http://siteapp.baidu.com/site/180du.com.cn
http://3g.xueshihou.com/

普通分类: 
wap
shiping1 的头像

网页loading图像

星期六, 2013-08-10 20:58 — shiping1

http://www.lanrentuku.com/gif/a/loading.html

普通分类: 
其它
shiping1 的头像

firefox 报错 Image corrupt or truncated:http://localhost/xxx/xxx/xx/xxx/xxx.jpg

星期六, 2013-08-10 19:21 — shiping1

问题找到了，是图片本身的问题，它或许不是一个真正的jpg。

普通分类: 
javascript
shiping1 的头像

几个使用jQuery的图片预加载函数

星期六, 2013-08-10 19:02 — shiping1
2011年12月31日 by Kamal in javascript | 评论关闭

最近项目中用到的一个功能，用户进入网站时显示loading页面，直到主页的几个大图片加载完成才渐隐进入主页。自己写了个插件，看起来结构挺糟糕的，不好意思放到项目里。在网上搜现成的，还挺多。

普通分类: 
javascript
shiping1 的头像

JS 图片预加载技术

星期六, 2013-08-10 18:58 — shiping1

JS 图片预加载技术

15 Dec 2011-JavaScript

18

JS 图片预加载技术

项目开发中时常需要用 JS 判断一张图片是否加载成功，

如果图片加载成功，则执行其相应的 onload 绑定事件，

这个就是我们所说的图片预加载技术，先上最终版代码：

普通分类: 
javascript
shiping1 的头像

纯CSS图片预加载

星期六, 2013-08-10 18:56 — shiping1

有很多种方法来实现图片的预加载，通常大部分使用Javascript让事情滚动。不要再受Javascript预载的束缚了吧，用CSS你就可以毫不麻烦的预载你的图片。

 

为什么使用预载

你为什么会考虑使用预载呢？你是否曾有个网站，在那个网站你要滚动你的导航然后有个延迟直到图片被加载完……嘿嘿。预载将在这方面帮助你。它将在页面加载的时候加载那些图片并将其存储在浏览器的缓存里面。这样当用户滚动导航的时候，很漂亮而且流畅，没有延迟。

CSS代码

这个概念就是写一个CSS样式设置一批背景图片，然后将其隐藏，这样你就看不到那些图片了。那些背景图片就是你想预载的图片。

这是一个例子:

普通分类: 
div+css
shiping1 的头像

用javascript预加载图片、css、js的方法研究

星期六, 2013-08-10 18:52 — shiping1

用javascript预加载图片、css、js的方法研究

预加载的好处可以让网页更快的呈现给用户，缺点就是可能会增加无用的请求（但图片、css、js这些静态文件可以被缓存），如果用户访问的页面里面的css、js、图片被预加载了，用户打开页面的速度会快很多，提升用户体验。在用到一些大图片展示的时候，预加载大图是很不错的方法，图片更快的被呈现给用户。不多说了，作为一个前端攻城师都懂的，下面分享我做的测试和得到的结果。

先说需要知道的服务器返回的status code：
status-code: 200 - 客户端请求成功
status-code: 304 - 文件已经在浏览器缓存中，服务器告诉客户端，原来缓冲的文档还可以继续使用。
本文测试判断文件被是否被缓存，用的就是判断是否返回304.

普通分类: 
javascript
shiping1 的头像

图片预加载技术 这个是ok

星期六, 2013-08-10 18:36 — shiping1

1.  图片预加载：在我们浏览网页时，可能会遇到大图片显示慢而影响到了页面其他功能的执行，或是因为网速慢等原因造成。从而我们需要预加载，不能让图片的下载与显示影响到页面其他部分。

通常的解决方案是：

a. 将图片替换成一些固定的某张小图片以实现预加载，然后再在底部的js通过img的onload函数替换已加载好笑图片的src为真正的图片地址。这样的方法可行，但是只适用于已知了固定尺寸且图片不是很大且可能很多这类图片的情况；

普通分类: 
javascript
shiping1 的头像

embed noembed 例子

星期六, 2013-08-10 18:23 — shiping1

普通分类: 
div+css
shiping1 的头像

ie6 背景

星期六, 2013-08-10 15:32 — shiping1

为什么这里 src不对

.fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancy_close.png', sizingMethod='scale'); }

为什么这里 src是对

.fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/templets/shipingzhong/style/fancybox/fancy_close.png', sizingMethod='scale'); }

普通分类: 
div+css
shiping1 的头像

ckeditor IE7 IE6报错 c.getselection()为空或不是对象

星期六, 2013-08-10 13:06 — shiping1 
在config.js加入如下配置： config.start
普通分类: 
javascript
shiping1 的头像

抽奖程序 jquery+php 幸运大转盘

星期六, 2013-08-10 08:46 — shiping1
源代码见 附件 jiang.rar
普通分类: 
jquery
shiping1 的头像

联想 G470开启无线开关

星期六, 2013-08-10 08:31 — shiping1

分几步 顺序可以不一致

1)Fn + F几(无线的图标)

2)电脑侧边的无线开关 (触屏左边一点点的垂直面有一个开关)  扳(开启)一下

3)查看无线指示灯是否正常

这样子应该就可以上网了

普通分类: 
其它

页面

Subscribe to 个人技术网_前端_后台_php_div_css_linux_javascript_seo RSS
Powered by Drupal

友情链接

校园好文网

 www.shipingzhong.cn  个人技术网_前端_后台    备案号:苏ICP备18010659号-2