php - 悬停时拆分按钮

Question

我正在寻找一种解决方案，以便在悬停时将一个基于图形的按钮一分为二。这两个按钮都会有一个网站链接。 我需要使用 HTML、JS 或 PHP 执行此操作。

如何管理？

澄清更新

1. 我的索引页上有一个大按钮图形，上面写着“Enter”。
2. 通过点击按钮，“输入”按钮消失
3. 两个新按钮出现在那个确切的位置。
4. 第一个说“英语版”，另一个说“西类牙语版”
5. 当鼠标离开该区域时，原来的按钮会重新显示，两个语言按钮会消失

Answer 1

您可以使用带有 jquery 和 jqueryui.Button 的 javascript 来做到这一点

来自 jqueryui 网站的示例:

http://jqueryui.com/demos/button/#splitbutton

<script>
    $(function() {
        $( "#rerun" )
            .button()
            .click(function() {
                alert( "Running the last action" );
            })
            .next()
                .button( {
                    text: false,
                    icons: {
                        primary: "ui-icon-triangle-1-s"
                    }
                })
                .click(function() {
                    alert( "Could display a menu to select an action" );
                })
                .parent()
                    .buttonset();
    });
</script>

<div class="demo">

<div>
    <button id="rerun">Run last action</button>
    <button id="select">Select an action</button>
</div>

</div><!-- End demo -->