Kynetx侧栏中的jQuery UI效果

我已经使用Kynetx的jQueryUI集成在页面上成功地实现了jQueryUI效果

但是，我很难从侧表中获得效果。这是我申请的规则。我希望有人能指出我遗漏了什么：

global {
  css  <<
         #tester 
         { 
             margin-left: 10px; 
             margin-top: 10px; 
             width: 80px; 
             height: 80px; 
             background: green; 
             position: relative; 
         }
       >>;
 }

rule tab is active {
select when pageview ".*" setting ()

 pre { 
        results = <<  
           <div id='tester'></div>
            >>;        
}
{
     sidetab() with pathToTabImage = "http://dl.dropbox.com/u/10762217/search-tab-images/tab2.png" 
               and tabColor = "transparent"
               and topPos = "50px"
               and message = results
               and divCSS = {
                             "z-index": 10000,
                             "backgroundColor": "#ffffff",
                             "width": "200px",
                             "padding": "0px",
                             "imageHeight": "162px",
                             "imageWidth": "53px",
                             "-moz-border-radius": "5px"
                            };
              watch("#tester", "click");
           }



 }



 rule jeffect_on_click is active {
     select when web click "#tester"
        jquery_ui:effect("#tester","bounce","normal");


 }
}

---

在我的元标签中。

你没有遗漏任何东西。当前，运行时，特别是

watch（）

操作使用，

.live（）

来注册事件处理程序

sidetab（）

吃掉与

.live（）

连接的所有事件处理程序

sidetab（）

吃掉它们，因为

.live（）

实际上是通过将单击处理程序附加到

文档

对象，然后观察事件是否冒泡而起作用。当它到达

文档

时，它会检查事件是否是从与选择器匹配的元素注册的，如果是，它会触发处理程序

sidetab（）

通过调用

event.StopperPagation（）

终止此操作，这将停止事件冒泡，因此它永远不会到达

文档，因此处理程序永远不会启动

您可以通过使用jQuery实用程序函数
.bind（）
注册事件处理程序来解决此问题
.bind（）
只会为已经存在的元素注册处理程序，但只要在调用
.bind（）
之前注意侧选项卡中的元素存在，就可以了

大概是这样的：

$K("#tester").bind("click", function() {
  $K(this).effect("bounce", { "times" : 3 }, 300);
});

让我们把它放在整个应用程序的上下文中，好吗

为了使这个示例保持简单，我们只需发出附加处理程序所需的javascript，并在单击时使div反弹。这个例子也是：

规则集a369x111{
元{
名称“侧选项卡->事件”
说明>
作者“AKO”
登录
使用javascript资源jquery\uUI\uJS
}
全球的{
css>；
}
规则选项卡{
在页面查看时选择“*”
前{
结果=>；
}
{
带有pathToTabImage=”的sidetab（）http://dl.dropbox.com/u/10762217/search-tab-images/tab2.png" 
和tabColor=“透明”
和topPos=“50px”
和消息=结果
和divCSS={
“z指数”：10000，
“背景色”：“ffffff”，
“宽度”：“200px”，
“填充”：“0px”，
“图像高度”：“162px”，
“图像宽度”：“53px”，
-moz边框半径：“5px”
};
发出
}
}
} 
我不太清楚“效果”是什么。它应该是什么样子，实际上是什么样子。如果屏幕截图是相关的，请点击。@Mike Grace他在寻找反弹效果。@Alex真棒！非常感谢。我会让你解决这个问题，因为我和sidetab之间有点讨厌的关系。：）
$K("#tester").bind("click", function() {
  $K(this).effect("bounce", { "times" : 3 }, 300);
});

ruleset a369x111 {
    meta {
        name "Sidetab->Events"
            description <<
                Sidetab jQuery
            >>
            author "AKO"
            logging on

            use javascript resource jquery_ui_js

    }
    global {
        css  <<
            #tester { 
                margin-left: 10px; 
                margin-top: 10px; 
                width: 80px; 
                height: 80px; 
                background: green; 
                position: relative; 
            }
        >>;
    }

    rule tab {
        select when pageview ".*"

            pre { 
                results = << 
                    <div id="tester"></div>
                >>;        
            }
        {
            sidetab() with pathToTabImage = "http://dl.dropbox.com/u/10762217/search-tab-images/tab2.png" 
                and tabColor = "transparent"
                and topPos = "50px"
                and message = results
                and divCSS = {
                    "z-index": 10000,
                    "backgroundColor": "#ffffff",
                    "width": "200px",
                    "padding": "0px",
                    "imageHeight": "162px",
                    "imageWidth": "53px",
                    "-moz-border-radius": "5px"
                };
                emit <|
                    $K("#tester").bind("click", function() {
                        $K(this).effect("bounce", { "times" : 3 }, 300);
                    });
               |>;
        }



    }
}