jquery - 如何使用 jQuery 更改 float 相反值

Question

我有以下 HTML/CSS 结构。

CSS:

<style>
    #main {
        width: 100%;
    }

    #main-title {
        background-color: #b5dcb3;
        width: 100%
    }

    #menu {
        background-color: #aaa;
        height: 200px;
        width: 100px;
        float: left;
    }

    #right-menu {
        background-color: #aaa;
        height: 200px;
        width: 100px;
        float: right;
    }

    #content {
        background-color: #eee;
        height: 200px;
        width: 350px;
        float: left;
    }

    #footer {
        background-color: #b5dcb3;
        clear: both
    }
</style>

HTML:

<div id="main">
    <div id="main-title">
        <h1>This is Web Page Main title</h1>
    </div>
    <div id="menu">
        <div><b>Main Menu</b></div>
        HTML
        <br /> PHP
        <br /> PERL...
    </div>
    <div id="content">
        <p>Technical and Managerial Tutorials</p>
    </div>
    <div id="right-menu">
        <div><b>Right Menu</b></div>
        HTML
        <br /> PHP
        <br /> PERL...
    </div>
    <div id="footer">
        <center>
            Copyright Area
        </center>
    </div>
</div>

现在我想应用镜像效果，例如 WHERE float:left 更改为 float:right 并且相同的反向 WHERE float:right 是更改为 float:left。

代码示例:http://jsfiddle.net/mananpatel/mw1sxpx0/

注意:我为 float:left 类和 float:right 类保留了不同的文件。

知道如何在页面加载时使用 jQuery 代码执行此操作。

Answer 1

试试这个:您可以像下面这样更改菜单的 css 样式属性

$(function(){
   $('#menu').css('float','right');
    $('#right-menu').css('float','left');
});

JSFiddle Demo