如何将.show( )转换为.reveal( )？

Question

我试图将代码中的.show()更改为.reveal()，但我似乎无法正确地做到这一点。不会生成错误，因为当我选择day_listing_mobile <span>的

这里是我的JavaScript代码

(function($) {
    var isMobile = (/iphone|ipad|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));  
    if (isMobile) {
        $('.event_list').hide(); // setting display:none; on all .event_list <ul> elements

        // attach click event to the <span class="day_listing"> elements
        $('.day_listing_mobile').click(function() {
            var $eventList = $(this).sibling('.event_list');

            $('.event_list').hide(); // again hide all possibly shown ones before opening the selected one

            $eventList.show(); // setting display:block on sibling <ul> of clicked <span>

            $('#myMobileModal').reveal();
        });
    }

})(jQuery);

，这是我隐藏的东西，我想揭露

{cal_cell_content}<span class="day_listing_mobile">{day}</span><div id="myMobileModal" class="reveal-modal"><ul class="event_list">{content}</ul></div>{/cal_cell_content}
            {cal_cell_content_today}<span class="day_listing_mobile" id="today_listing">{day}</span><div id="myMobileModal" class="reveal-modal"><ul class="event_list">{content}</ul></div>{/cal_cell_content_today}

上面的代码使用CodeIgniter的Calendar类生成<ul>，这是我在移动设备上使用的.hide()类，并且我希望最终实现.reveal()而不是.show()。

这里是.reveal() 工作

<script type="text/javascript">
$(document).ready(function() {
     $('#myButton').click(function(e) {
          e.preventDefault();
      $('#myModal').reveal();
     });
});
</script> 

(Zurb透露更多信息)

免责声明：我对web开发很陌生，对任何与JavaScript相关的东西都不感兴趣。

Answer 1

html

{cal_cell_content}
<span class="day_listing_mobile">{day}</span>
<div id="myMobileModal" class="reveal-modal">
    <ul class="event_list">{content}</ul>
</div>
<a id="myButton" data-reveal-id="myModal" href="javascript://">myButton</a>
{/cal_cell_content}

js

$(document).ready(function() {
    $('.day_listing_mobile').click(function(e) {
        var $eventList = $(this).siblings('.event_list');
        $('.event_list').hide();
        $eventList.show();
        $('#myMobileModal').reveal();
    });
});

css

//从reveal.css (确保包括它)

.reveal-modal {
    visibility: hidden;
    top: 100px;
    left: 50%;
    margin-left: -300px;
    width: 520px;
    background: #eee url(modal-gloss.png) no-repeat -200px -80px;
    position: absolute;
    z-index: 101;
    padding: 30px 40px 34px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
    -webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
    box-shadow: 0 0 10px rgba(0,0,0,.4);
    }

小提琴

http://jsfiddle.net/c4urself/EUPYT/