javascript - JQuery:如何使用 HTML ascii 箭头作为切换指示器?

标签 javascript jquery

我来了across this great JQuery example使用滑动开关。

我想按原样实现它,除了一件事。

该示例使用图像作为向上和向下(白色)箭头指示器。

我不能使用 HTML ascii 向上箭头 (↑) 和向下箭头 (↓) 来代替使用图像吗?

如果是这样,怎么办?

最佳答案

我相信这样的事情应该有效:

$(".btn-slide").click(function(){
  $("#panel").slideToggle("slow");
  $(this).toggleClass("active");

  //Toggle text here (I may have the up/down order inverted)
  $(".btn-slide").toggle(function() {
      $(this).text('Slide ↑');
    }, function() {
      $(this).text('Slide ↓');
  });
  return false;
}); 

基本上,这个想法只是在单击链接时切换链接上的文本,这与作者切换上/下幻灯片的位置相同。

有关 toggle() 的更多信息在这里。

您还需要从此处删除白色背景图像:

.btn-slide  {
background:url("images/white-arrow.gif") no-repeat scroll right -50px 

HTH

关于javascript - JQuery:如何使用 HTML ascii 箭头作为切换指示器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2696669/

相关文章:

javascript - jquery 查找文本并替换(全部)

javascript - jQuery AJAX 函数返回奇怪的输出

javascript - PHP数组查找元素错误

javascript - 无法找到查询字符串值

javascript - jquery - 3 级相关选择列表

jquery - 使用 jQuery 将列表项从一个列表复制到另一个列表

javascript - 如何通过 wordpress rest api 从自定义表中获取所有记录?

javascript - 按后退按钮刷新所有信息 : Ruby on Rails

javascript - 什么是数据类型以及如何初始化它?

jquery - GON - 在 js.erb + Rails 5 中没有获得值(value)