lightbox的使用方法
问题一lightbox2.0想用在我的blog里问题是网上搜了一下都还是不明白到底要怎么用的网上最常见的那三个步骤我都不太明白的1、Lightboxv2.0使用Proto...
问题一 lightbox2.0 想用在我的blog里
问题是网上搜了一下都还是不明白到底要怎么用的
网上最常见的那三个步骤我都不太明白的
1、Lightbox v2.0 使用 Prototype 框架和 Scriptaculous 效果库。你将需要外调这三个 Javascript 文件放在你的网页header里面
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/scriptaculous.js?load=effects" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
我的困惑是 header在哪里。。。(请不要嘲笑我 人家小白 ><)
2、外调 Lightbox CSS 文件 (或添加 Lightbox 样式到你现行的样式表中)。
<link href="css/lightbox.css" rel="stylesheet" type="text/css" media="screen" />
第二个困惑 这段代码要放到什么位置 @ @
3、检查 CSS 并确定调用的 prev.gif 和 next.gif 文件在正确的位置。同样要确定调用的 loading.gif 和 close.gif 文件及 lightbox.js 文件在正确的位置
步骤 2 - 激活1、添加 rel=”lightbox” 属性到任何一个链接标签去激活lightbox. 例如:
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
这个是什么意思 是用我的图片地址更换 image/image-1.jpg么??
如果安装成功的话 在blog里贴图要怎么贴?直接贴地址还是有上传框??
还有我Down了Lightbox那个软件 解压出来三个文件夹 CSS image 和JS
可是我完全不知道这个是做什么用的。。。。囧
问题二 还有那种显示略缩图 点击一下会跳到别的界面显示大图的效果是怎么做的?
问题三 blog界面的READ MORE 点一下会跳转到新的界面显示全文 怎么设置代码能让它不用跳转就直接显示全文呢?
问题多了点儿
希望能有高手好好回答。。小女子感激不尽~~~
超级感谢的~~~已经明白了一些咯
因为我用的是FC2的blog 可以自定义模板 也可以自己加一些插件进去的 我看到有用fc2 blog的筒子我说的那些效果都做到了。。所以想问一下。。能把那些html的写法告诉我么??感谢UPM我~~~我会给U加分的~~~ 展开
问题是网上搜了一下都还是不明白到底要怎么用的
网上最常见的那三个步骤我都不太明白的
1、Lightbox v2.0 使用 Prototype 框架和 Scriptaculous 效果库。你将需要外调这三个 Javascript 文件放在你的网页header里面
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/scriptaculous.js?load=effects" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
我的困惑是 header在哪里。。。(请不要嘲笑我 人家小白 ><)
2、外调 Lightbox CSS 文件 (或添加 Lightbox 样式到你现行的样式表中)。
<link href="css/lightbox.css" rel="stylesheet" type="text/css" media="screen" />
第二个困惑 这段代码要放到什么位置 @ @
3、检查 CSS 并确定调用的 prev.gif 和 next.gif 文件在正确的位置。同样要确定调用的 loading.gif 和 close.gif 文件及 lightbox.js 文件在正确的位置
步骤 2 - 激活1、添加 rel=”lightbox” 属性到任何一个链接标签去激活lightbox. 例如:
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
这个是什么意思 是用我的图片地址更换 image/image-1.jpg么??
如果安装成功的话 在blog里贴图要怎么贴?直接贴地址还是有上传框??
还有我Down了Lightbox那个软件 解压出来三个文件夹 CSS image 和JS
可是我完全不知道这个是做什么用的。。。。囧
问题二 还有那种显示略缩图 点击一下会跳到别的界面显示大图的效果是怎么做的?
问题三 blog界面的READ MORE 点一下会跳转到新的界面显示全文 怎么设置代码能让它不用跳转就直接显示全文呢?
问题多了点儿
希望能有高手好好回答。。小女子感激不尽~~~
超级感谢的~~~已经明白了一些咯
因为我用的是FC2的blog 可以自定义模板 也可以自己加一些插件进去的 我看到有用fc2 blog的筒子我说的那些效果都做到了。。所以想问一下。。能把那些html的写法告诉我么??感谢UPM我~~~我会给U加分的~~~ 展开
2个回答
2015-07-10
展开全部
Lightbox JS 是一个简单而又谦恭的用来把图片覆盖在当前页面上的脚本. 它能被快速安装并且运作于所有流行的浏览器.
使用方法如下:
步骤 1 - 安装
1、Lightbox v2.0 使用 Prototype 框架和 Scriptaculous 效果库. 将需要外调这三个 Javascript 文件在的 header.
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
2、外调 Lightbox CSS 文件 (或添加 Lightbox 样式到现行的样式表中).
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
3、检查 CSS 并确定调用的 prev.gif 和 next.gif 文件在正确的位置. 同样要确定调用的 loading.gif 和 close.gif 文件及 lightbox.js 文件在正确的位置.
步骤 2 - 激活
1、添加 rel="lightbox" 属性到任何一个链接标签去激活lightbox. 例如:
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
可选择项: 使用 title 属性加上说明.
2、如果有一套想分组的相关图片, 接着上一部并且又在 rel 属性中添加一个带方括号的组名. 例如:
<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>
3、没有限定每个页面的图片组数量和每个图片组图片的数量。
使用方法如下:
步骤 1 - 安装
1、Lightbox v2.0 使用 Prototype 框架和 Scriptaculous 效果库. 将需要外调这三个 Javascript 文件在的 header.
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
2、外调 Lightbox CSS 文件 (或添加 Lightbox 样式到现行的样式表中).
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
3、检查 CSS 并确定调用的 prev.gif 和 next.gif 文件在正确的位置. 同样要确定调用的 loading.gif 和 close.gif 文件及 lightbox.js 文件在正确的位置.
步骤 2 - 激活
1、添加 rel="lightbox" 属性到任何一个链接标签去激活lightbox. 例如:
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
可选择项: 使用 title 属性加上说明.
2、如果有一套想分组的相关图片, 接着上一部并且又在 rel 属性中添加一个带方括号的组名. 例如:
<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>
3、没有限定每个页面的图片组数量和每个图片组图片的数量。
展开全部
1、Lightbox v2.0 使用 Prototype 框架和 Scriptaculous 效果库。你将需要外调这三个 Javascript 文件放在你的网页header里面
我的困惑是 header在哪里。。。(请不要嘲笑我 人家小白 ><)
header是网页的头部区域,一般是
<head>。。。。。。。。</head>结构,你把你的语法放到其中,只要不影响其他语句就好,最笨的办法是直接放到<head>之后,这样肯定不影响其他语句。
2、外调 Lightbox CSS 文件 (或添加 Lightbox 样式到你现行的样式表中)。
<link href="css/lightbox.css" rel="stylesheet" type="text/css" media="screen" />
第二个困惑 这段代码要放到什么位置 @ @
css是用来规定样式的文件,一般放到title段的下方中即可
例如下例子:
<title>益盟股票论坛 操盘手,基金,财经,投资,港股,论坛,证券,软件</title>
<link href="/bbs/style/style.css" rel="stylesheet" type="text/css">
<link href="/style/css_menu.css" rel="stylesheet" type="text/css">
3、检查 CSS 并确定调用的 prev.gif 和 next.gif 文件在正确的位置。同样要确定调用的 loading.gif 和 close.gif 文件及 lightbox.js 文件在正确的位置
步骤 2 - 激活1、添加 rel=”lightbox” 属性到任何一个链接标签去激活lightbox. 例如:
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
这个是什么意思 是用我的图片地址更换 image/image-1.jpg么??
这个的意思是如果你要加载的css文件所在路径为/bbs,其下有image目录,css规定要加载的图片文件要到image文件夹中找。
也就是你css所在文件夹下要有images文件夹,并且其中有你要指定的例如image-1.jpg等。
======================
如果安装成功的话 在blog里贴图要怎么贴?直接贴地址还是有上传框??
还有我Down了Lightbox那个软件 解压出来三个文件夹 CSS image 和JS
可是我完全不知道这个是做什么用的。。。。囧
一般的博客网站很少能给客户直接访问文件目录功能,也就是已经给定你的框架,你就用,不能再添加东西更改了,例如我在原来页面上新增一个页面,这个页面不是基于blog系统生成的,而是我在我的blog主页上定制的指向另一个文件,如index.html等,除非你是vip客户,大型blog系统不会给你这种特权。
基于安全考虑,否则成了给你免费空间放主页了!!
==========
问题二 还有那种显示略缩图 点击一下会跳到别的界面显示大图的效果是怎么做的?
用blog本身能提供的功能实现是最好的,所有想实现的功能都基于是否blog系统能提供给你,而不是你想做什么就能做到。
问题三 blog界面的READ MORE 点一下会跳转到新的界面显示全文 怎么设置代码能让它不用跳转就直接显示全文呢?
如果blog系统能让你直接填写html代码并解析,这个并不困难,但我接触的blog都把这个功能作死了,例如163.com的和sina.com的,这个功能是blog的功能,不是你要自己设计的功能。
举个例子,你要整清楚,你是去饭店吃饭,不是拿着菜去饭店作。。。不过你可以自带饮料,但是有些东西还是要受所在环境限制的,例如你自带菜要自己做,在饭店吃,还不想给饭店钱。。。。
不知道这个例子贴切否。
我的困惑是 header在哪里。。。(请不要嘲笑我 人家小白 ><)
header是网页的头部区域,一般是
<head>。。。。。。。。</head>结构,你把你的语法放到其中,只要不影响其他语句就好,最笨的办法是直接放到<head>之后,这样肯定不影响其他语句。
2、外调 Lightbox CSS 文件 (或添加 Lightbox 样式到你现行的样式表中)。
<link href="css/lightbox.css" rel="stylesheet" type="text/css" media="screen" />
第二个困惑 这段代码要放到什么位置 @ @
css是用来规定样式的文件,一般放到title段的下方中即可
例如下例子:
<title>益盟股票论坛 操盘手,基金,财经,投资,港股,论坛,证券,软件</title>
<link href="/bbs/style/style.css" rel="stylesheet" type="text/css">
<link href="/style/css_menu.css" rel="stylesheet" type="text/css">
3、检查 CSS 并确定调用的 prev.gif 和 next.gif 文件在正确的位置。同样要确定调用的 loading.gif 和 close.gif 文件及 lightbox.js 文件在正确的位置
步骤 2 - 激活1、添加 rel=”lightbox” 属性到任何一个链接标签去激活lightbox. 例如:
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
这个是什么意思 是用我的图片地址更换 image/image-1.jpg么??
这个的意思是如果你要加载的css文件所在路径为/bbs,其下有image目录,css规定要加载的图片文件要到image文件夹中找。
也就是你css所在文件夹下要有images文件夹,并且其中有你要指定的例如image-1.jpg等。
======================
如果安装成功的话 在blog里贴图要怎么贴?直接贴地址还是有上传框??
还有我Down了Lightbox那个软件 解压出来三个文件夹 CSS image 和JS
可是我完全不知道这个是做什么用的。。。。囧
一般的博客网站很少能给客户直接访问文件目录功能,也就是已经给定你的框架,你就用,不能再添加东西更改了,例如我在原来页面上新增一个页面,这个页面不是基于blog系统生成的,而是我在我的blog主页上定制的指向另一个文件,如index.html等,除非你是vip客户,大型blog系统不会给你这种特权。
基于安全考虑,否则成了给你免费空间放主页了!!
==========
问题二 还有那种显示略缩图 点击一下会跳到别的界面显示大图的效果是怎么做的?
用blog本身能提供的功能实现是最好的,所有想实现的功能都基于是否blog系统能提供给你,而不是你想做什么就能做到。
问题三 blog界面的READ MORE 点一下会跳转到新的界面显示全文 怎么设置代码能让它不用跳转就直接显示全文呢?
如果blog系统能让你直接填写html代码并解析,这个并不困难,但我接触的blog都把这个功能作死了,例如163.com的和sina.com的,这个功能是blog的功能,不是你要自己设计的功能。
举个例子,你要整清楚,你是去饭店吃饭,不是拿着菜去饭店作。。。不过你可以自带饮料,但是有些东西还是要受所在环境限制的,例如你自带菜要自己做,在饭店吃,还不想给饭店钱。。。。
不知道这个例子贴切否。
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询