在jquery lavalamp菜单上居中显示图像

我无法将图像居中。地址是

如你所见，有一个菜单，箭头在其中移动。我的问题是现在我需要箭头始终位于文本的中心。代码如下：

css:

这是html

 <ul class="lavaLampBottomStyle" id="1">
                        <li><a href="#">Startseite</a></li>
                        <li class="current"><a href="#">Speisekarte</a></li>
                        <li><a href="#">Anfahrt</a></li>
                        <li><a href="#">Kontakt</a></li>
                    </ul>

这里是洗手池

(function($){$.fn.lavaLamp=function(o){o=$.extend({fx:"linear",speed:500,click:function(){}},o||{});return this.each(function(){var b=$(this),noop=function(){},$back=$('<li class="back"><div class="left"></div></li>').appendTo(b),$li=$("li",this),curr=$("li.current",this)[0]||$($li[0]).addClass("current")[0];$li.not(".back").hover(function(){move(this)},noop);$(this).hover(noop,function(){move(curr)});$li.click(function(e){setCurr(this);return o.click.apply(this,[e,this])});setCurr(curr);function setCurr(a){$back.css({"left":a.offsetLeft+"px","width":a.offsetWidth+"px"});curr=a};function move(a){$back.each(function(){$(this).dequeue()}).animate({width:a.offsetWidth,left:a.offsetLeft},o.speed,o.fx)}})}})(jQuery);

（函数（$）{$.fn.lavaLamp=function（o）{o=$。扩展（{fx:“线性”，速度：500，点击：function（）{}，o}；返回这个。每个（函数（{var b=$（this），noop=function（）{}，$back=$（'
'）。追加到（b），$li=$（$li），$this），curr=$（$li.curr=$）（$li.current），this）[0].$li[0.addli=$current]（$current]），noop]），不移动（noop））{$（this）.hover（noop，function（）{move（curr）}）；$li.click（function（e）{setCurr（this）；return o.click.apply（this，[e，this]）；setCurr（curr）；function setCurr（a）{$back.css（{“left”：a.offsetLeft+“px”，“width”：a.offsetWidth+“px”}）；curr=a}；function move（a）{$back each（function（）{function（）{（function（）{（function（）{（this.）.dequeue（）{.dequeue（）））}）.animatetle（{width:a.offsidth:a.offsidth，left:a.fx，left:a.fx，speed}）（jQuery）；

---

谢谢

我知道这已经很晚了，但是你的网站实际上帮助我找到了这个，我现在正在使用它来创建我的新投资组合网站。要实现“以中心为中心”的外观，请更改以下内容

.lavaLampBottomStyle li.back{
---背景：url（../images/menu\u top\u arrow.png）不重复；
---背景位置：左中0px；
---页边距顶部：33px；
---左边距：20px；
---高度：46px；
---宽度：自动；
---z指数：8；
---位置：绝对；
}

由于“宽度”设置为“自动”，因此li元素与它悬停的li的宽度相同，因此使用简单的居中背景位置即可

(function($){$.fn.lavaLamp=function(o){o=$.extend({fx:"linear",speed:500,click:function(){}},o||{});return this.each(function(){var b=$(this),noop=function(){},$back=$('<li class="back"><div class="left"></div></li>').appendTo(b),$li=$("li",this),curr=$("li.current",this)[0]||$($li[0]).addClass("current")[0];$li.not(".back").hover(function(){move(this)},noop);$(this).hover(noop,function(){move(curr)});$li.click(function(e){setCurr(this);return o.click.apply(this,[e,this])});setCurr(curr);function setCurr(a){$back.css({"left":a.offsetLeft+"px","width":a.offsetWidth+"px"});curr=a};function move(a){$back.each(function(){$(this).dequeue()}).animate({width:a.offsetWidth,left:a.offsetLeft},o.speed,o.fx)}})}})(jQuery);