首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Galleriffic链接

Galleriffic链接
EN

Stack Overflow用户
提问于 2010-06-24 03:20:54
回答 2查看 2.8K关注 0票数 2

我在我的页面上有一个Galleriffic的幻灯片。现在,“大”图片链接到幻灯片中的下一张图片。我如何才能让它链接到外部文件?

EN

回答 2

Stack Overflow用户

发布于 2010-06-24 03:25:18

首先,您必须将隐藏的div或span标记添加到无序列表中:

代码语言:javascript
复制
<li>
  <a class="thumb" href="/imageurl/image.gif">imageititle</a>
  <span id="project-path" style="display:none;">example_path</span>
</li>

然后,将此代码添加到galleriffic.js文件中。您正在从span元素获取路径:

代码语言:javascript
复制
addImage: function(listItem, thumbExists, insert, position) {
                    var $li = ( typeof listItem === "string" ) ? $(listItem) : listItem;                
                    var $aThumb = $li.find('a.thumb');
                **  var $path = $li.find('#project-path');
                **  var projectPath = $path.text();
                    var slideUrl = $aThumb.attr('href');
                    var title = $aThumb.attr('title');
                    var $caption = $li.find('.caption').remove();
                    var hash = $aThumb.attr('name');

然后,将该值添加到image变量:

代码语言:javascript
复制
            var imageData = {
        **      projectPath:projectPath,
                title:title,
                slideUrl:slideUrl,
                caption:$caption,
                hash:hash,
                gallery:this,
                index:position
            };

现在告诉画廊在全尺寸画廊图像上更改链接和新路径:

代码语言:javascript
复制
            // Construct new hidden span for the image
            var newSlide = this.$imageContainer
                .append('<span class="image-wrapper current"><a class="advance-link" rel="history" href="/project/'+imageData.projectPath+'" title="'+imageData.title+'">&nbsp;</a></span>')
                .find('span.current').css('opacity', '0');

并在此处注释掉图库单击操作,这样您的用户就可以使用正常的链接来包装图像:

代码语言:javascript
复制
                        newSlide.find('a')
                .append(imageData.image)
                //.click(function(e) {
                    //gallery.clickHandler(e, this);
                //})
                ;
票数 10
EN

Stack Overflow用户

发布于 2011-02-07 21:05:00

是的-在http://prestondentalgroup.com.au/downloads.html上,幻灯片图像上的超链接允许查看者打开/保存PDF文档。运行良好(一旦我破译了如何编写项目并用example_path文件(包括子文件夹)的URL替换/project/ )。因此,要从站点的图像/下载/文件夹链接到readme.pdf,example_path就变成了图像/下载/readme.pdf

和/project/变成http:/prestondentalgroup.com.au/

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/3104811

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档