Question

所以我一直在尝试使用@ font-face来尝试设置this website的方向箭头并且没有任何运气。我所有的其他@ font-face一直在工作，但这个不会。所以我需要在页面上添加粉红色箭头;所以我可以使用图像代替。我想我找到了代码的位置;但是我的Javascript知识非常渺茫。如果我发布了错误的代码，我很抱歉，但就是这样。我需要做的是找出如何用链接到箭头图像的图像替换“（”。提前感谢。

directionNav:!0,prevText:"(",nextText:")"

Answer 1

快速浏览一下，这些元素的CSS选择器上没有左/右消歧器，这使得简单的jQuery代码使图像元素更复杂一些。你仍然可以找到相关DOM节点的 list ，然后假设第一个是左边，第二个是右边，并附加图像子节点。

但更简单的是，作为对可接受的东西的第一个近似，你可以简单地使用&lsaquo;（对于角度引用）或←（对于实际箭头）？也许这就是你开始的地方。

我们可以从

看到

jQuery(".flex-direction-nav").length;

您的导航周围有一个CSS类的单个元素，类似地

jQuery(".flex-direction-nav li").length;

表明只有两个li元素，就像我上面谈到的那样。因此，您可以使用以下几行手动交换图像

jQuery(jQuery(".flex-direction-nav li a")[0]).text("").append("<img src='path/to/left.png' alt='left'>");
jQuery(jQuery(".flex-direction-nav li a")[1]).text("").append("<img src='path/to/right.png' alt='right'>");

清除括号并将合适的图像附加到导航容器子节点li元素中包含的链接标记。这些jQuery包装中的一个可能不是必需的，但它不应该伤害任何东西。

您应该能够将这些行放在页面加载初始化代码的任何地方。如果您还没有拥有任何初始化代码，则可以直接将函数传递给jQuery：

jQuery(function() { console.log("This is called when the page is ready."); });

我不是100％我正在回答你提出的问题，但我希望这会有所帮助。

用flexslider.js中的图像替换字符串

1 个答案: