在Javascript照片库中插入锚点 - 不起作用?

时间:2011-10-03 20:21:46

标签: javascript html hyperlink anchor photo-gallery

我正在使用jAlbum(使用lightflow skin)为我的网站创建照片库。画廊加载并采用漂亮的旋转木马格式。我想添加锚点,我可以直接链接到图库中的某张照片。我试图在HTML中添加锚点但它不起作用。我认为这是因为当页面加载时,画廊需要几秒钟才能加载,因此不会重定向到锚点。我很容易出错,需要一些关于我应该尝试让锚点工作的建议。以下是锚点和照片本身的示例代码:

<div class="item">
    <a name="anchor3" id="anchor3"></a>
      <img class="content hidden" src="thumbs/tree-w-sun.jpg" alt="Gifts" />
            <div class="ref hidden">item8</div>
            <div class="caption"><h3>Gifts</h3></div>
            <div class="comment hidden"></div>
            <div class="author hidden"></div>
            <div class="params hidden"></div>
            <div class="info hidden"><div><p>Artist: UBhapE2</p></div></div>
            <div class="thumbWidth hidden">261</div>
            <div class="thumbHeight hidden">350</div>
            <a id="item8" class="lightwindow hidden" title="<h3>Gifts</h3>" 
               rel="gal[cat]" href="slides/tree-w-sun.jpg" ></a>
    </div>

我已尝试链接到我插入的锚点(anchor3)和jAlbum(item8)插入的ID,但都无法正常工作。

有一些脚本可以控制图库并将它们放在这里:

脚本1 - “Lightflow JS”

var LightFlowGlobal = {};

function getParam( name ){
 name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
 var regexS = "[\\?&]"+name+"=([^&#]*)";
 var regex = new RegExp( regexS );
 var results = regex.exec( window.location.href );
 if( results == null )
   return "";
 else
   return results[1];
}

脚本2 - “ContentFlow JS”这个JS很长,为了空间我把链接直接放到JS file here

脚本3 - 此脚本位于页面中:

<script language="JavaScript" type="text/javascript">
var startItem = getParam('p');
if(startItem == "") startItem = "first";
if(startItem.isNaN) startItem = "'"+startItem+"'";

new ContentFlow('contentFlow', {
    reflectionColor: "#000000",
    maxItemHeight: 350,
    marginTop: 50,
    reflectionHeight: 0.25,
    endOpacity: 1,
    startItem: startItem,
    circularFlow: false,
    stretchThumbs: false
});


function lightWindowInit() {
    LightFlowGlobal.myLightWindow = new lightwindow({
            infoTabName : "More Info",
            rootPath: "res/lightwindow/",
            loadingTxt: "loading or ",
            cancelTxt: "cancel",
            playTxt: "start slideshow",
            stopTxt: "stop slideshow",
            slowerTxt: "slower by 1 second",
            fasterTxt: "faster by 1 second",
        downloadSlideTxt: "Download",
        downloadSlide: false,
            showSlideshow: false,
            slideshowDuration: 5000,
        circular: false,
        animationDuration: 0.25
        });
}
LightFlowGlobal.readyJS=true;
var rootPath = ".";

</script>

我不确定需要什么其他脚本或CSS。我链接到我正在工作的测试库with here if you需要查看页面。如果需要,我会发布其他信息。

那么现在我如何让锚点与它一起工作?我在javascript上不是很好,所以请解释答案vs“你需要将这个功能添加到脚本”而不解释。

感谢您的任何和所有帮助!

2 个答案:

答案 0 :(得分:1)

ContentFlow网站上的文档 - &gt;下;作为链接的项目,开发人员明确指出“项目中的任何元素都不能包含任何锚点”。也许有人可以解决这个限制。

答案 1 :(得分:0)

我想出了Photo Gallery Creater提供的答案:

It's not only the js. You'd need to pass a parameter to AddThis in order to 
identify the image. Without it, you wouldn't know which image has been clicked. 
The best would be to use LightFlow's query paramter p=index, where index is the 
number of the image of the current web page.
For example, the following link would focus the 4th image of the gallery 
(index begins at 0): http://your-domain.com/album/index.html?p=3