在信息上我们可以加上一个关闭按钮，然后再用点 JavaScript ，让用户可以关闭信息的显示 .. 这里有个一般的信息 .. 在这里先添加一个关闭按钮 .. 用一个小 i 标签， 上面加上 close 还有 icon 这两个类 ..

i.close.icon

你会看到，在信息的右上角，会显示一个关闭按钮 .. 不过现在点击这个按钮并不能关掉显示这个信息 .. 需要用点 JavaScript 设置一下这个小图标的关闭功能 .. 在这个页面的最下面 .. 可以添加点 JavaScript .. 用一组 script 标签 ..

注意这里我们已经嵌入了 jQuery .. 还有 semantic.js .. 先找到页面上的关闭小图标 .. .message 下面的 .close ，意思就是信息下面的那个关闭小图标 .. 找到以后再使用 jQuery 的 click 方法 .. 给这个小图标绑定一个点击的事件 ... 点击以后要做的事可以放在这个方法里的匿名函数里面 ..

用一个 $(this) .. 用一个 closest 方法 .. 找到离这个关闭按钮最近的 .message ... 再使用 semantic UI 提供的 transition 方法 .. 在这个方法里可以加上过度的时候使用的动画效果 .. 默认是 fade ..

$('.message .close').click(function () {
$(this).closest('.message').transition('fade');
});

保存 .. 然后点击这个关闭按钮 .. 这样可以关闭信息的显示 .. 用的动画效果是 fade .. 我们再试一下其它的动画效果 .. 比如换成 fly ..

再点一下这个关闭按钮 ... 现在这个信息会用 fly 这种动画效果在页面上消失 ..