基于js读取gif文件（js制作gif）

本文目录一览：

• 1、js如何实现先调用一个gif格式的图片，在调用一个png图片
• 2、asp js 如何读取文件夹中的图片并点击自动播放后可以每隔一秒播放一张？
• 3、javascript中怎样读取指定文件夹里的图片？
• 4、原生js获取文件
• 5、js获取图片路径

js如何实现先调用一个gif格式的图片，在调用一个png图片

使用js等待！初始化加载的时候。img id=”tu” src=”动态图片.gif”/

10秒后执行js代码，改变src=“静态图片.jpg”

我只能帮你提供思路了。代码网上直接找来组织一下就可以了。

asp js 如何读取文件夹中的图片并点击自动播放后可以每隔一秒播放一张？

script

$(function(){

$(‘.slides’).slides({ 这里就是图片滚动代码还有两个js

preload: true,

preloadImage: ‘img/loading.gif’,

play: 2800,

pause: 2500,

hoverPause: true

});

});

/script

javascript中怎样读取指定文件夹里的图片？

var i_strngth = 1;

var i_image = 0;

var imageurl = new Array();

// 这一部分我是手功指定的图片路径,你的图片路径是放在数据库中的，只用在这里做更改，把路径的设置改成动态读取就可以了

//======================================

imageurl[0] =”images/pic1.gif”;

imageurl[1] =”images/pic2.gif”;

imageurl[2] =”images/pic3.gif”;

imageurl[3] =”images/pic4.gif”;

//======================================

function showimage()

{

if(document.all)

{

if (i_strngth = 110)

{

div_Pic.innerHTML = “img style=\”filter:alpha(opacity='” + i_strngth + “‘); height:248px; width:138px;\” src='” + imageurl[i_image] + “‘ border=’0’ /”;

i_strngth = i_strngth + 10;

var timer=setTimeout(“showimage()”, 100);

}

else

{

clearTimeout(timer);

var timer = setTimeout(“hideimage()”, 1000);

}

}

if(document.layers)

{

clearTimeout(timer)

document.div_Pic.document.write(“img src='” + imageurl[i_image] + “‘ border=’0′ style=’height:248px; width:138px;’ /”);

document.close();

i_image++;

if (i_image = imageurl.length)

{

i_image = 0;

}

var timer = setTimeout(“showimage()”, 2000);

}

}

function hideimage()

{

if (i_strngth = -10)

{

div_Pic.innerHTML = “img style=\”filter:alpha(opacity='” + i_strngth + “‘); height:248px; width:138px;\” src='” + imageurl[i_image] + “‘ border=’0’ /”;

i_strngth = i_strngth – 10;

var timer = setTimeout(“hideimage()”, 100);

}

else

{

clearTimeout(timer)

i_image++;

if (i_image = imageurl.length)

{

i_image = 0;

}

i_strngth = 1;

var timer=setTimeout(“showimage()”, 500);

}

}

那就需要用到Ajax技术，你是用时间来做为图片名称，那么可以用程序取出文件名然后选取离系统当前时间最近的一个文件做为当前显示的图片，然后回传达到JS来进行图片路径的更改显示

原生js获取文件

HTML5新增了关于文件的File，FileReader两个对象，用于获取文件信息和读取文件信息。

var

    fileInput = document.getElementById(‘test-image-file’),

    info = document.getElementById(‘test-file-info’),

    preview = docement.getElementById(‘test-image-preview’);

//监听change事件

fileInput.addEventListener(‘change’, function() {

  //清除背景图片

  preview.style.backgroundImage = ”;

  //检查文件是否选择

  if(!fileInput.value) {

    info.innerHTML = ‘没有选择文件’;

    return;

  }

  //获取file文件引用：

  var file = fileInput.files[0];

  //获取文件信息

  info.innerHTML = ‘文件：’ + file.name + ‘br’ +

                  ‘大小：’ + file.size + ‘br’ +

                  ‘修改：’ + file.lastModifiedDate;

if(file.type !== ‘image/jpeg’ file.type !== ‘image/png’ file.type !== ‘image/gif’) {

  alert(‘不是有效的图片文件’);

  return;

}

  //读取文件

  var reader = new FileReader();

  reader.onload = function(e) {

    var data = e.target.result;

  preview.style.backgroundImage = ‘url(‘+ data + ‘)’;

  };

  //以DataURL的形式读取文件：

  reader.readerAsDataURL(file);

})

js获取图片路径

理论是可以的，首先用js取得location，然后在和图片路径相加

哦

想复杂了

其实很简单，你在image元素里面加个onclick事件，这样写

tabletr

tdinput type=”image” id=”expression1″ name=”expression1″ src=”1.gif” onClick=”soso(this)/td

tdinput type=”image” id=”expression2″ name=”expression2″ src=”2.gif” onClick=”soso(this)/td

tdinput type=”image” id=”expression3″ name=”expression3″ src=”3.gif” onClick=”soso(this)/td

tdinput type=”image” id=”expression4″ name=”expression4″ src=”4.gif” onClick=”soso(this)/td

tdinput type=”image” id=”expression5″ name=”expression5″ src=”5.gif” onClick=”soso(this)/td

/tr/table

div id=”abc” /div

script language=”javascript”

function soso(tt){

document.all(“abc”).innerHTML=”img Src='”+tt.src+”‘”

}

/script

________________________________

你是想在abc层某处加上这个表情么？类似在线编辑器？

那么简单的办法就是在abc层里面再加个div或者span，赋予ID，修改soso函数里面的ID名就可以了