Changes between Initial Version and Version 3 of Ticket #6740


Ignore:
Timestamp:
Dec 10, 2010, 10:55:07 AM (12 years ago)
Author:
Scott González
Comment:

Thanks for creating the jsFiddle test case, I've removed the inline code from the description.

Legend:

Unmodified
Added
Removed
Modified

  • Ticket #6740

    • Property Status changed from new to open

  • Ticket #6740 – Description

    initial v3  
    55I have a list of droppable items that are all under an accordion.  When a user drags the draggable item towards the accordion I would like to change the accordion's event handler from "click" to "mouseover" so that they can hover over a panel and have it automatically expand.  This will let them drop the item under any panel.
    66
    7 Following is my test case:
    8 
    9 
    10 {{{
    11 <!DOCTYPE HTML>
    12 <html lang="en"><head>
    13 <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    14         <meta charset="utf-8">
    15         <title>jQuery UI Accordion - Test Case</title>
    16         <link rel="stylesheet" href="default_files/jquery.css">
    17         <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
    18         <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js"></script>
    19         <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/ui-lightness/jquery-ui.css">
    20         <script>
    21         $(document).ready(function() {
    22                 $( "#accordion" ).accordion();
    23                 $("#readEvent").bind('click', function (){
    24                         var event = $( "#accordion" ).accordion( "option", "event" );
    25                         $("#eventStatus").text(event);
    26                 });
    27                 $("#changeEvent").bind('click', function (){
    28                         $( "#accordion" ).accordion( "option", "event", 'mouseover' );
    29                         alert("Change event to " + $( "#accordion" ).accordion( "option", "event" ));
    30                 });
    31                
    32         });
    33         </script>
    34         <script>
    35                 function showEventStatus(){
    36                         //var event = $( "#accordion" ).accordion( "option", "event" );
    37                         //$("#eventStatus").text(event);
    38                         alert('Show');
    39                 }
    40                 function changeEvent(){
    41                         //$( "#accordion" ).accordion( "option", "event", 'mouseover' );
    42                         alert('Change');
    43                 }
    44                
    45 
    46         </script>
    47 </head><body>
    48 
    49 <div class="demo">
    50 
    51 <div id="accordion">
    52    <h3><a href="#">Section 1</a></h3>
    53    <div>
    54       Section 1 content
    55    </div>
    56    <h3><a href="#">Section 2</a></h3>
    57    <div>
    58       Section 2 content
    59    </div>
    60    <h3><a href="#">Section 3</a></h3>
    61    <div>
    62       Section 3 content
    63    </div>
    64 </div>
    65 
    66 </div>
    67 
    68 </div>
    69 
    70 <div class="demo-description">
    71 <p>
    72 <div id="changeEvent">Change Event</div>
    73 </p>
    74 <p>
    75 <div id="readEvent">Read Event</div>
    76 </p>
    77 <p id="eventStatus">
    78 Display event Status here
    79 </p>
    80 </div>
    81 
    82 </body></html>
    83 }}}
     7[http://jsfiddle.net/ubMrz/ test case]
    848
    859In this page you can click the "Change event" text to change the accordion's event from (the default) "click" to "mouseover".  However, the accordion itself doesn't start to respond to a mouseover.  If you click the "Read event" you'll see that the "Display event status here" line changes to "mouseover".  This proves that the value has been changed, however, the accordion's behaviour remains the same.