链接应该打开fancybox（$ .fancybox.pos）与点击功能的帮助 [英] Link should open fancybox ($.fancybox.pos) with the help of the click function

问题描述

我想要一个按钮，打开fancybox相关组与一定的图片。我不太确定这是否有效，但我会试一试。我的问题是，如果用户点击链接，我想执行jQuery。这是我有的代码

  var js =jQuery.fancybox.pos（+ currentImage +）; 
 //从js字符串创建一个新函数
 var newclick = new Function（js）; 
 
 jQuery（a.enlarge）。click（newclick）; 
  

代码基于此答案。我希望
jQuery.fancybox.pos（2）工作。但目前我没有得到的点击功能工作。

我目前的设定：

 < script type =text / javascript> 
 var currentImage = 0; 
 
 function getCurrImage（carousel，state）{
 currentImage = carousel.first-1; 
 
 jQuery（a.enlarge）。click（function（）{
 alert（currentImage）; 
 jQuery.fancybox.pos（currentImage）; 
} ）; 
} 
 
 jQuery.noConflict（）; 
 
 jQuery（document）.ready（function（）{
 jQuery（'＃mycarousel'）。jcarousel（{
 scroll：1，
'itemLoadCallback' getCurrImage 
}）; 
 jQuery（'a [rel = example_group]'）。fancybox（{
'transitionIn'：'none'，
'transitionOut'：'none' 
}）; 
}）; 
< / script> 
  

jQuery.fancybox.pos（currentImage）; 不工作。 currentImage 似乎是正确的，但是如果按钮被点击4次，警报弹出4次。这意味着：

点击1：currentImage = 0

click 2：currentImage = 1，currentImage = 1

：currentImage = 2，currentImage = 2，currentImage = 2

click 4：currentImage = 3，currentImage = 3，currentImage = 3，currentImage = 3

更新：

新尝试：

 < script type =text / javascript> 
 var currentImage = 0; 
 
 function openfancy（）{
 jQuery.fancybox.pos（currentImage）; 
} 
 
 function getCurrImage（carousel，state）{
 currentImage = carousel.first-1; 
 
 jQuery（a.enlarge）。unbind（click，openfancy）; 
 jQuery（a.enlarge）。bind（click，openfancy）; 
} 
 
 jQuery.noConflict（）; 
 
 jQuery（document）.ready（function（）{
 jQuery（'＃mycarousel'）。jcarousel（{
 scroll：1，
'itemLoadCallback' getCurrImage 
}）; 
 jQuery（'a [rel = example_group]'）。fancybox（{
'transitionIn'：'none'，
'transitionOut'：'none' 
}）; 
}）; 
< / script> 
  

jQuery.fancybox.pos（currentImage）; 仍然不工作。有机会吗？也许是因为我在这个页面上有多个fancyboxes？我也尝试过 jQuery（'。fancybox'）。fancybox.pos（currentImage）; 但我得到错误消息，它不是一个函数。

解决方案

pos 函数从来没有工作。所以我想到一个被删除的答案使用点击功能。如果用户点击我的链接，应该模拟对图库中图片的点击。

 < script type =text / javascript> 
 var currentImage = 0; 
 
 function getCurrImage（carousel，state）{
 currentImage = carousel.first-1; 
} 
 
 /*jQuery.noConflict();*/ 
 
 jQuery（document）.ready（function（）{
 jQuery（'＃ fancybox（'fancyboxus'）。jcarousel（{
 scroll：1，
'itemLoadCallback'：getCurrImage 
}）; 
 jQuery（'a [rel = example_group] 
'transitionIn'：'none'，
'transitionOut'：'none'
}）; 
 jQuery（'＃enlarge'）。 $ b jQuery（。jcarousel-item）。eq（currentImage）.children（a）。click（）; 
}）; 
}）; 
< / script> 
  

我需要几个小时才能知道这一点！

I want a button which opens the fancybox rel-group with a certain picture. I'm not quite sure if this works but I'll give it a try. My problem is that I want to execute jQuery if the user clicks on a link. This is the code I have

var js = "jQuery.fancybox.pos("+currentImage+");";
// create a new function from the "js" string
var newclick = new Function(js);

jQuery("a.enlarge").click(newclick);

The code is based on this answer. I hope that jQuery.fancybox.pos(2) works. But currently I'm not getting the click function to work. What I'm doing wrong?

Edit:

My current setup:

<script type="text/javascript">
  var currentImage = 0;

  function getCurrImage(carousel, state){
     currentImage = carousel.first-1;

     jQuery("a.enlarge").click(function() {
       alert(currentImage);   
       jQuery.fancybox.pos(currentImage);
     });
   }

   jQuery.noConflict();

   jQuery(document).ready(function() {
       jQuery('#mycarousel').jcarousel({
           scroll:1,
           'itemLoadCallback': getCurrImage 
       }); 
       jQuery('a[rel=example_group]').fancybox({
           'transitionIn': 'none',
           'transitionOut': 'none'
       });
   });
</script>

jQuery.fancybox.pos(currentImage); doesn't work. currentImage seems to be correct, but the alert pops up 4 times if the button was clicked 4 times. That means:

click 1: currentImage=0
click 2: currentImage=1, currentImage=1
click 3: currentImage=2, currentImage=2, currentImage=2
click 4: currentImage=3, currentImage=3, currentImage=3, currentImage=3

Update:

New try:

<script type="text/javascript">
  var currentImage = 0;

function openfancy(){
   jQuery.fancybox.pos(currentImage);
}

  function getCurrImage(carousel, state){
     currentImage = carousel.first-1;

     jQuery("a.enlarge").unbind("click", openfancy);
     jQuery("a.enlarge").bind("click", openfancy);
   }

   jQuery.noConflict();

   jQuery(document).ready(function() {
       jQuery('#mycarousel').jcarousel({
           scroll:1,
           'itemLoadCallback': getCurrImage 
       }); 
       jQuery('a[rel=example_group]').fancybox({
           'transitionIn': 'none',
           'transitionOut': 'none'
       });
   });
</script>

jQuery.fancybox.pos(currentImage); still doesn't work. Is there any chance? Perhaps its because I have multiple fancyboxes on that page? I also tried it with jQuery('.fancybox').fancybox.pos(currentImage); but I get the error message that it is not a function.

解决方案

The pos function never worked. So I took the idea of a deleted answer to use the click-function. If a user clicks on my link it should simulate the click on the picture in the gallery.

<script type="text/javascript">
    var currentImage = 0;

    function getCurrImage(carousel, state){
        currentImage = carousel.first-1;
    }

    /*jQuery.noConflict();*/

    jQuery(document).ready(function() {
        jQuery('#fancycarousel').jcarousel({
            scroll:1,
            'itemLoadCallback': getCurrImage 
        }); 
        jQuery('a[rel=example_group]').fancybox({
            'transitionIn': 'none',
            'transitionOut': 'none'
        });
        jQuery('#enlarge').click(function(){
            jQuery(".jcarousel-item").eq(currentImage).children("a").click();
        }); 
    });
</script>

I needed hours to figure this out!

这篇关于链接应该打开fancybox（$ .fancybox.pos）与点击功能的帮助的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！