开发者

eventClick with lightBox?

开发者 https://www.devze.com 2022-12-21 18:39 出处:网络
开发者_如何学GoHow I can open lightBox in eventClick, I need init a lightBox whe I click in a event.
开发者_如何学Go

How I can open lightBox in eventClick, I need init a lightBox whe I click in a event.

Thanks!!


I actually ended up using fancybox and the way I managed to get it working was to use the eventAfterRender to bind it up. I didn't have to do anything to the eventClick to prevent url follow, I think fancybox took care of that. It didn't work when I performed this same wire up in the eventClick so you might want to follow this example with lightbox and see if that works for you as well. Here is the relevant part of what I did. Cheers!

$('#calendar').fullCalendar({
    eventAfterRender: function(event, element, view ) { 
        if(event.url) {
            $('a',$(element)).fancybox({
                type: 'ajax'
            });
        }                    
    }    
});


eventClick documentation is located here: http://arshaw.com/fullcalendar/docs/mouse/eventClick/

Within the eventClick function you'll write code to display your lightBox. Are you having any specific issues? You're question is very general.


I was unable to get this to work correctly. Everytime I clicked on any link, not just events, it would display a lightbox. I ended up using the event className attribute to set it to fancybox and that is working for me.

Below is my code:

<script type="text/javascript" src="jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="jquery.fancybox.css?v=2.1.5" media="screen" />
<script type="text/javascript">
    $(document).ready(function() {
        $('.fancybox').fancybox({
            width: 1500,
            midWidth: 900,
            height : 800,
            minHeight: 600
        });
    });
</script>

$('#calendar').fullCalendar({
    events: [
        {
          id: 2,
          className: \"fancybox fancybox.iframe\",
          title: 'Event 1',
          start: new Date(2013, 7, 12),
          url: '../sample.jsp'
        }
    ]
});
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号