javascript - 如何在单击时更改 div 并在之后保持更改?

标签 javascript html css

我正在尝试制作一个 div,以便在单击它时它会变大并改变颜色以附加到另一个 div。我到目前为止的代码是:

    <div id="wrapper">
            <a href="homepage.html" onmousedown="javascript:(btn=document.getElementById('btnhome')).className = (btn.className  == 'clicked') ? '' : 'clicked';"><div id="btnhome">Home</div></a>
    </div>

和CSS:

    #btnhome.clicked{
       background-color:#ff9014;
       height:50px;
    }

我已经做到了这一点,这确实使 div 在单击时发生变化,但它不会使 div 在单击后保持原样,这正是我希望实现的。

我有一个包含文本的橙色 div,上面是按钮所在的位置(我使用 div 作为按钮)。单击时我希望按钮变大并连接到另一个 div 以显示用户所在的页面。因此,我希望按钮在单击时加载页面,然后保持增加的大小,以此来查看您所在的页面。

最佳答案

不要切换类名。始终设置为单击。

onmousedown="javascript:(btn=document.getElementById('btnhome')).className = 'clicked';"

关于javascript - 如何在单击时更改 div 并在之后保持更改?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24186712/

相关文章:

javascript - Knockout.JS 绑定(bind)处理程序 moment.js

javascript - 重复 ID 的影响

javascript - 在 d3 中访问不同级别的嵌套列表

javascript - jQuery 步骤与 Bootstrap 验证器

javascript - 单击并拖动溢出的元素 : hidden doesn't trigger onmouseout in firefox

Android SVG 显示问题

javascript - 两个onclick事件

javascript - 如何将 css 文件添加到打开的窗口

html - 有没有证据表明其他浏览器会支持谷歌浏览器拖拽下载到桌面?

html - 导航栏图片有空格