如何避免两次浮动相同的内容?

时间:2010-12-27 18:46:12

标签: html css krl

我的Kynetx应用使用float_html()来放置一个装满内容的盒子。

rule float_box {
  select when pageview ".*"
  pre {
    content = <<
      <div id='messagebox'>
      <h3>Floating Message Box</h3>
      <ul id='my_list'></ul>
      </div>
    >>; // trippy
  }
  float_html("absolute","top:25px","right:20px",content);
}

rule fill_box {
  select when pageview ".*"
  foreach ["alpha","bravo","charlie"] setting (list_item)
  append("#my_list", "<li>#{list_item}</li>");
}

app(a421x27)用于书签。如果您在同一页面上两次点击书签,则会获得双重内容。

有没有办法检测到该框已经在屏幕上并重复使用?

1 个答案:

答案 0 :(得分:4)

您可以使用jQuery手动浮动内容,并检查它是否已经存在。

ruleset a60x516 {
  meta {
    name "so-answer-example"
    description <<
      so-answer-example
    >>
    author "Mike Grace"
    logging on
  }

  rule float_box {
    select when pageview ".*"
    pre {
      content = <<
        <div id='messagebox'>
        <h3>Floating Message Box</h3>
        <ul id='my_list'></ul>
        </div>
      >>; /// fixing syntax highlighting bug
    }
    {
      emit <|
        if ($K("#messagebox").length == 0) {
          $K(content).css({
            "position": "absolute",
            "top": "25px",
            "right": "20px"
          }).appendTo(document.body);
        };
      |>;
    }
  }

  rule fill_box {
    select when pageview ".*"
    foreach ["alpha","bravo","charlie"] setting (list_item)
    {
      append("#my_list", "<li>#{list_item}</li>");
    }
  }
}

这是在example.com上多次单击此代码中的书签后的样子 alt text


附注:

始终将您的行动包裹在{}中。如果您只有一个操作,则操作无需包含在{}中,但最好养成使用{}标记操作块的习惯。