0

我正在使用 jQuery UI 选项卡，并且在每个选项卡列表项 (li) 的锚点内都有一个图像。我想要发生的是每个非活动选项卡的图像大小为一定大小，单个活动选项卡的大小更大。我不知道该怎么做。我对 javascript 不是很好，无法弄清楚如何让脚本的 if 语句（见下文）正确......我想我需要做的就是做到这一点，以便当有一个选定的选项卡时，该选项卡内的图像获得更大的尺寸。

这是我拥有的脚本：

 <script type="text/javascript">
     $(function() {
         $( "#tabs" ).tabs();

         if( $('#tabs .ui-tabs-active').attr('active') ) {
             $('.theLogo').css({'width' : '120px' , 'height' : '60px'});
         }
         else {
            $('.theLogo').css({'width' : '90px' , 'height' : '45px'});
         };

     });
 </script>

这是选项卡的 HTML：

  <div id="tabs">
                <ul>
                    <li><a href="#tabs-1"><img src="picture1.png" alt="Picture 1" name="photo" id="photo" class="theLogo" /></a></li>
                    <li><a href="#tabs-2"><img src="picture2.png" alt="Picture 2" name="photo2" id="photo2" class="theLogo" /></a></li>
                    <li><a href="#tabs-3"><img src="picture3.png" alt="Picture 3" name="photo3" id="photo3" class="theLogo" /></a></li>
                </ul>
                <div id="tabs-1">
                  <iframe class="resultFrame" src="http://www.fakesite123.net"></iframe>
                </div>
                <div id="tabs-2">
                    <iframe class="resultFrame" src="http://www.fakesite1234.net"></iframe>
                </div>
                <div id="tabs-3">
                    <iframe class="resultFrame" src="http://www.fakesite1235.net"></iframe>
                </div>
            </div>

谢谢你的帮助！

4

2 回答 2

1

Figured it out by using CSS instead of javascript. I put the following CSS:

 .ui-state-default img {
     width:90px;
     height:45px;
 }
 .ui-state-active img {
     width:120px;
     height:60px;
 }

I hope this helps someone who runs into the same problem.

Anyone that finds a javascript solution for this is more than welcome to post it!

于 2013-02-07T23:39:30.333 回答
1

有什么理由你必须用 JS 来做吗？

ul#tabs li a img {width: 90px; height: 45px;}
ul#tabs li.ui-tabs-active a img {width: 120px; height: 60px;}
于 2013-02-07T23:38:12.457 回答