MixItUp 可以动态的对页面上的项目进行排序,我们先去添加排序用的按钮 .. 把它放在这个标题的下面,先添加一个容器 .. 在它里面用一个基本的按钮群组 .. div.ui.basic.buttons ..
在这个群组里添加四个按钮 .. div.ui.button .. 设置一下按钮上的文字 .. 默认 .. 随机 .. 升序 .. 还有 降序 ..
MixItUp 用来排序的按钮上默认需要有一个名字是 sort 的 css 类 .. 这里我们可以把这个类添加到这个按钮群组的包装元素上 .. 然后手工设置一下排序的按钮 .. 添加一个 sort ..
然后在 MixItUp 的配置对象里 .. 找到 selectors 这个属性 .. 在它的里面添加一个 sort .. 它的值就是排序用的按钮 .. 这里我们把它设置成 .sort .button ..
排序按钮的功能,我们可以在按钮上的 data-sort 这个属性里设置一下 .. 在这些按钮的上面 .. 添加一个 data-sort 属性 .. 它的值就是排序的方法 ..
默认的排序我们可以添加一个 default .. 随机的排序 .. 用一个 random .. 保存一下 ..
点一下 随机 .. 这样页面上的内容项目会随机排序 .. 再按一下 默认 .. 会使用默认的排序方法 ..