更改函数变量onclick并再次单击它

Question

I am using this jQuery totem plugin https://github.com/buildinternet/totem

My code:

JavaScript

<script type="text/javascript">
        $(function(){
            $('#newslistul').totemticker({
                row_height  :   '34px',
                max_items   :   1
                });
        });
</script>

HTML

<!-- Start News Bar --> 
    <section id="news">
        <div class="container">
            <p>EV.news</p>
            <div id="newslist">
                <ul id="newslistul">
                    <li><a href="#" title=""><i class="fa fa-angle-right fa-lg" style="margin-right: 4px;"></i> May 25, 2010  Cras sodales augue a nulla tincidunt tincidu sce congue massa enim consequt nonummy</a></li>
                    <li><a href="#" title=""><i class="fa fa-angle-right fa-lg" style="margin-right: 4px;"></i> Apr 25, 2010  Vivamus sollicitudin erat ut turpis convallis eleife</a></li>
                    <li><a href="#" title=""><i class="fa fa-angle-right fa-lg" style="margin-right: 4px;"></i> Sept 25, 2010  Cras sodales augue a nulla tincidunt tincidu sce congue massa enim consequt nonummy</a></li>
                    <li><a href="#" title=""><i class="fa fa-angle-right fa-lg" style="margin-right: 4px;"></i> Sept 25, 2010  Headline lorem ipsum dolor sit amet, consectetur adipiscing elitc  vamus id mauris eu mi rutrum tempus</a></li>
                </ul>
            </div><!-- /.newslist -->
            <a href="#" id="news"><i class="fa fa-plus-square" style="position: relative; top: -8px; color: grey;"></i></a>
        </div><!-- /.container -->
    </section>
    <!-- End News Bar -->

I want next: When you click on

<a href="#" id="news"><i class="fa fa-plus-square" style="position: relative; top: -8px; color: grey;"></i></a>

link, ul list to expand and show all 4 li. Variables row_height: '34px' , and max_items:1 should change values to row_height : '130px' , and max_items: 4 on click on link a href adn get back to 1 on the same click.

Answer 1

Write an onClick handler for #news modify $.omr.totemticker.defaultOptions object with new max_items and row_height variable. $.omr.totemticker is returned by the library when initializing it. That should help you.