如何将下一张和上一张幻灯片的名称悬停在下一个和上一个按钮上？

Question

I need your help to implement a hover function on the arrows of the slider showing the name of the next slide on the "next" arrow and the name of previous slide on the "prev" arrow.

I tried to code it with jQuery but I can't seem to get it working.

Thanks for you help!

Answer 1

You can implement it like;

$("#next").mouseenter(function () {
    // Next slide name
    $(this).html("N1");
});
$("#next").mouseleave(function () {
    $(this).html("Next");
});

$("#prev").mouseenter(function () {
    // Prev slide name
    $(this).html("P1");
});
$("#prev").mouseleave(function () {
    $(this).html("Prev");
});

jsfiddle link