Question

我正在尝试使用setTimeout函数创建一个svg动画属性开关。当我添加＆＃34; jQuery（＆＃39;＃animation2＆＃39;）。attr（＆＃39; xlink：href＆＃39;，＆＃39; #core_type＆＃39;）;＆＃34;在setTimeout函数中但是当我添加变量时它什么都不做。这是代码：

    var AttributeOne = jQuery('#animation2').attr('xlink:href', '#core_type');
    var AttributeTwo = jQuery('#animation1').attr('xlink:href', '#core_type');
    var AttributeSwitch = AttributeOne;
    (function theLoop (i) {
        if(AttributeSwitch == AttributeOne) {
        AttributeSwitch = AttributeTwo;  
        } else {
            AttributeSwitch = AttributeOne; 
        }
        setTimeout(function () {
            AttributeSwitch
        if (--i) {          
          theLoop(i);       
        }
      }, 6000);
    })(100);

Answer 1

Try this

DEMO

This one is pretty much what you want.

Add your own css to it

HTML :

 <div id="tabs">
<ul class="tabs" id="tabsnav">
    <li><a href="#tab-1" class="menu-internal">Tab 1</a></li>
    <li><a href="#tab-2" class="menu-internal">Tab 2</a></li>
    <li><a href="#tab-3" class="menu-internal">Tab 3</a></li>
    <li><a href="#tab-4" class="menu-internal">Tab 4</a></li>
</ul>

<div id="tab-1">
    Contents for tab 1
</div>
<div id="tab-2">
    Contents for tab 2 
</div>
<div id="tab-3">
    Contents for tab 3
</div>
<div id="tab-4">
    Contents for tab 4  
</div>
</div>
JAVASCRIPT:

jQuery(document).ready(function() {
jQuery('#tabs > div').hide(); // hide all child divs
jQuery('#tabs div:first').show(); // show first child div
jQuery('#tabsnav li:first').addClass('active');

jQuery('.menu-internal').click(function(){
jQuery('#tabsnav li').removeClass('active');
var currentTab = jQuery(this).attr('href');
jQuery('#tabsnav li a[href="'+currentTab+'"]').parent().addClass('active');
jQuery('#tabs > div').hide();
jQuery(currentTab).show();
return false;
});
// Create a bookmarkable tab link
hash = window.location.hash;
elements = jQuery('a[href="'+hash+'"]'); // look for tabs that match the hash
if (elements.length === 0) { // if there aren't any, then
jQuery("ul.tabs li:first").addClass("active").show(); // show the first tab
} else { elements.click(); } // else, open the tab in the hash
});
Hope this helps

jQuery属性自动切换

1 个答案: