网页点击图片代码（网页中点击图片显示大图）

本篇文章给大家谈谈网页点击图片代码，以及网页中点击图片显示大图对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、请求网页设计高手帮忙解决一下在网页中点击图片可放大的代码怎么写？
• 2、html点击按钮时切换图片的代码
• 3、求代码 网页上点击图片就将图片保存的代码
• 4、网页中图片点击滚动代码
• 5、网页制作中插入图片的代码是什么
• 6、鼠标点击图片后能够显示出文字的网页代码

请求网页设计高手帮忙解决一下在网页中点击图片可放大的代码怎么写？

html

head

title图片放大/title

script type="text/javascript"

function zoomIn(){

//此处点击图片时会将图片放大到原来的三倍大小，重复点击一直放大

var imgNode = document.getElementById("image");

var width = imgNode.width;

var height = imgNode.height;

var width_tmp = width*3;

var height_tmp = height*3;

imgNode.style.width = width_tmp+"px";

imgNode.style.height = height_tmp+"px";

}

/script

/head

body

img src="image/1.jpg" id="image" onclick="zoomIn()"/

/body

/html

希望可以帮到你

html点击按钮时切换图片的代码

html点击按钮时切换图片的代码如下：

script src=""/script

style

#hello{width:108px;height:108px;border:1px solid #369;overflow:hidden;margin:auto;}

#word{margin:auto;width:136px;}

/style

div id="hello"

img src=";fm=203"

img src=";fm=203"

img src=";fm=203"

/div

div

input type="button" value="上一张" onclick="a()";

input type="button" value="下一张" onclick="b()";

/div

script

function a(){

$('#hello').find('img').eq(0).appendTo($('#hello'));

}

function b(){

$('#hello').find('img:last').eq(0).prependTo($('#hello'));

}

/script

HTML超级文本标记语言文档制作不是很复杂，但功能强大，支持不同数据格式的 文件镶入，这也是万维网（ WWW）盛行的原因之一，其主要特点如下：

简易性：超级文本标记语言 版本升级采用 超集方式，从而更加灵活方便。

可扩展性：超级文本标记语言的广泛应用带来了加强功能，增加 标识符等要求，超级文本标记语言采取子类元素的方式，为系统扩展带来保证。

平台无关性：虽然 个人计算机大行其道，但使用 MAC等其他机器的大有人在，超级文本标记语言可以使用在广泛的平台上，这也是 万维网（ WWW）盛行的另一个原因。

通用性：另外， HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的电脑或浏览器。

求代码 网页上点击图片就将图片保存的代码

先是在CSDN查到了这个代码：

img src="" id=mxh

input type=button onclick="a=window.open(document.all.mxh.src);a.document.execCommand('SaveAs')" value="save"

要求在同一个domain（域）

试了下，是新建一个窗口，显示这张图片，然后另存，最后关掉这个窗口。但在Maxthon下试下，新开的窗口似乎关不掉。

后来，在czxiu发现了这样的代码，有效。

整理下，它是通过将隐藏iframe的地址设置为图片的地址，实现另存的。

实现的代码如下：

先在页面中加入一个隐藏iframe。

div style="display:none;"

iframe width="0" height="0" id="genFrm" name="_genFrm" src="about:blank"/iframe

/div

JS实现函数

function SaveImage(img)

{

var win = $('genFrm').contentWindow;

if (!win || img.tagName != 'IMG') return;

win.location.href = img.src;

setTimeout(function() { win.document.execCommand("SaveAs"); }, 200);

}

页面中代码

img src="/img/title_wait.gif" id="DemoImg" border="0" /

a href="javascript:void(SaveImage(document.getElementById('DemoImg')))"点击这里下载图片/a

img的src必须和页面是同一域的，否则会出现权限错误的提示。非同域的图片目前没有找到用JS保存的方法。不过，此功能在Firefox下无效。

网页中图片点击滚动代码

html 代码：

ul

li id="h1"a href="javascript:void(0);"span1/span/a/li

li id="h2"a href="javascript:void(0);"span2/span/a/li

li id="h3"a href="javascript:void(0);"span3/span/a/li

li id="h4"a href="javascript:void(0);"span4/span/a/li

li id="h5"a href="javascript:void(0);"span5/span/a/li

/ul

div id="h1_body"/div

div id="h2_body"/div

div id="h3_body"/div

div id="h4_body"/div

div id="h5_body"/div

/div

js代码:

var p_idx=0;

function Photo(path,title,url){

this.Path=path;

this.Title=title;

this.URL=url;

}

var photos=[new Photo('SpeakerPhoto/123.jpg','Liu Changchun',213.aspx'),""];//图片用，分割

$(function(){

GetPhoto(0,4,$("#h1_body"));

GetPhoto(4,4,$("#h2_body"));

GetPhoto(8,4,$("#h3_body"));

GetPhoto(12,4,$("#h4_body"));

GetPhoto(16,2,$("#h5_body"));

});

function GetPhoto(inx,num,box)

{

for(var i=0;inum;i++)

{

$(box).append('a href="'+photos[inx].URL+'"img src="'+photos[inx].Path+'" title="'+photos[inx].Title+'" //a');

inx++;

}

}

function GetSinglePhoto(inx)

{

document.write('img src="'+photos[inx].Path+'" title="'+photos[inx].Title+'" /');

}

网页制作中插入图片的代码是什么

1、在代码中经常用到的插入图片代码是img属性，格式就是img src="" alt=""   src后面是添加图片的地址，后面的alt是对图片的描述。

2、在插入图片前，要将html文件和图片文件放在一个文件夹内，这里的img文件夹就是专门存放图片的地方。

3、然后回到代码栏，在src中输入链接地址img/pic_01.jpg，要将图片的具体地址和名称全部写全才可以在网页中看到，否则就会显示连接失败错误而无法观看到图片。

4、将文件保存后，在浏览器中我么就可以看到此刻的图片被添加进来了，位于网页的左上角位置。

5、如果想要移动图片的所在位置，就需要先对其包装一下，用一个盒子将其包裹，然后调整盒子的位置就相当于移动的是图片的位置了。

6、如图，之前设置的盒子距离顶部100px.然后距离左侧100px，这样就将盒子挤到了现在所在的位置，如图所示。

鼠标点击图片后能够显示出文字的网页代码

只要单击图片，就会弹出一个对话框，在对话框中显示你要显示的文字

html

head

script

language="vbscript"

!--

sub

yt_onclick

msgbox"你好"

end

sub

sub

ty_onclick

msgbox"hello"

end

sub

--

/script

/head

body

a

href=#

name=tyimg

src="你要显示的图片"/a

/body

/html

网页点击图片代码的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于网页中点击图片显示大图、网页点击图片代码的信息别忘了在本站进行查找喔。