Javascript 如何在jquery中对文本重新排序和设置动画？

首先，我做了一个手术室

背景：

好的，我在几个标题标记h1、h2、h3中有一个span标记。在这个标签里面是单词

经验的拼写倒过来是这样的：

问题:

我不确定实现这一点的最佳方法，但我希望悬停：

重新排序以正确拼写经验 如果可能的话，在重新排序时为它们设置重叠动画

---

我不知道如何做到这一点，但我一直在思考正则表达式，数组，但这感觉太复杂了，我真的不知道任何关于正则表达式和正确的数组排序。任何能指引我正确方向的信息都将不胜感激。或者对Or进行编辑就太好了。

一个可能的解决方案是使用css来实现这一点。此解决方案不会设置过渡动画，它只是更改字母的顺序。将此添加到css中：

.hover-spell:hover{
    direction: rtl; 
    unicode-bidi: bidi-override;
}

编辑：感谢Marcel Gwerder指出这一点

---

我发现它通过一个给定的文本字符串，将每个字符包装在一个范围内，然后为每个字符分配transiton样式，这可能有助于jquery解决方案。

一个可能的解决方案是使用css来实现这一点。此解决方案不会设置过渡动画，它只是更改字母的顺序。将此添加到css中：

.hover-spell:hover{
    direction: rtl; 
    unicode-bidi: bidi-override;
}

<span id = "spell">olleh</span>   //hello in reverse

<script type="text/javascript">
        var newText;
        var text = null;
        text = document.getElementById("spell").innerHTML;
        for (var i = text.length - 1; i >= 0; i--) {




            if (i == text.length - 1) {
                newText = text.substr(i, 1);
            }
            else {
                newText = newText + text.substr(i, 1);
            }
         }
        alert(newText);
    </script>

编辑：感谢Marcel Gwerder指出这一点

我发现它遍历给定的文本字符串，将每个字符包装在一个范围内，然后为每个字符指定transiton样式，这可能有助于jquery解决方案

<span id = "spell">olleh</span>   //hello in reverse

<script type="text/javascript">
        var newText;
        var text = null;
        text = document.getElementById("spell").innerHTML;
        for (var i = text.length - 1; i >= 0; i--) {




            if (i == text.length - 1) {
                newText = text.substr(i, 1);
            }
            else {
                newText = newText + text.substr(i, 1);
            }
         }
        alert(newText);
    </script>

在body标签中编写此脚本

---

在body tag中编写此脚本…

我刚刚尝试使用jquery设置一些动画，要获得一个外观奇特的动画有点棘手。但那一个看起来并不坏

---

要让它与Hover（包括mouseleave）一起工作要复杂一些。您也可以尝试存储位置，然后将它们彼此滑动，但这有点复杂。

我刚刚尝试使用jquery设置一些动画，要获得一个外观奇特的动画有点棘手。但那一个看起来并不坏

---

要让它与Hover（包括mouseleave）一起工作要复杂一些。你也可以尝试一些存储位置的方法，然后将它们彼此滑动，但又有点复杂。

加上一个表示聪明，但他妈的知道如何将其设置为动画吗？@MatthewHarwood使用此css解决方案将无法获得动画，因为加一是为了聪明，但他妈的知道如何让这个动画化吗？@MatthewHarwood你不会用这个css解决方案获得动画，因为我能想到的任何事情都是将每个字母包装在一个容器中，这样你就可以操纵它们的位置。从JS中的字符串中获取字母实际上很简单——因为字符串是数组——只需执行var theString='ASD'；console.logtheString[2]将得到S。字符串中的字母数在string.length中。我能想到的就是将每个字母包装在一个容器中，以便您可以操纵它们的位置。从JS中的字符串中获取字母实际上很简单——因为字符串是数组——只需执行var theString='ASD'；logtheString[2]将得到S。字符串中的字母数为string.length。