我使用第三方插件显示带有动画的文本,现在动画完成后我的 html 看起来像这样
<div data-cj-randomize="false" data-cj-loop="false" class="cj-fx cj-fx-text-link" id="effect-1" style="font-size: 32px; color: rgb(34, 34, 34); width: 850px;"><a class="cj-fx-spacer"> </a>
<a data-cj-scale-y-end="1" data-cj-scale-y-start="0" data-cj-rotate-x-end="0" data-cj-rotate-x-start="90" data-cj-buffer-y="70" data-cj-buffer-x="70" data-cj-animate-opacity="true" data-cj-easing="Circ.easeInOut" data-cj-duration="5000" data-cj-animation-delay="0" data-cj-start-delay="0" data-cj-animate-by-word="false" data-cj-sequence="forward" data-cj-direction="in" data-cj-type="flyTopCenter" class="cj-fx-text" target="_blank" href="#" style="">
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 0px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">T</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 31px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">h</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 55px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">e</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 77px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">m</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 114px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">e</span>
<span style="position: static; left: 136px;"> </span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 149px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">f</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 164px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">o</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 190px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">r</span>
<span style="position: static; left: 207px;"> </span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 220px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">O</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 256px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">p</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 281px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">e</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 303px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">n</span>
<span style="position: static; left: 327px;"> </span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 340px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">C</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 373px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">l</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 385px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">a</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 407px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">s</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 426px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">s</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 445px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">r</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 462px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">o</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 488px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">o</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 514px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">m</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 551px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">s</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 570px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">–</span>
<span style="position: static; left: 595px;"> </span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 608px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">T</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 639px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">O</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 675px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">I</span>
<span style="position: static; left: 692px;"> </span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 705px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">M</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 749px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">a</span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 771px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">r</span>
<span style="position: static; left: 788px;"> </span>
<span style="visibility: visible; transition-property: opacity, left, top, -moz-transform; transition-duration: 5s; transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); opacity: 1; left: 801px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">1</span>
<span style="visibility: visible; opacity: 1; left: 826px; top: 0px; transform: rotateX(0deg) scaleY(1); position: static;" class=" cj-tween">3</span>
</a>
</div>
我需要使用 jquery 将文本设置在中心