gpt4 book ai didi

javascript - 使用响应式设计将 href 短信更改为 href mailto?

转载 作者:行者123 更新时间:2023-11-30 09:40:45 25 4
gpt4 key购买 nike

如果设备不支持短信,即不是在手机(iPhone、Android 等)上查看页面,是否可以将 href 短信更改为 href mailto?

我已经设法制作了一个“喊”按钮,它使用短信发送页面的 url,但我希望它在不在手机上查看时更改为 mailto,即当正在查看页面时平板电脑、笔记本电脑等。

这是我拼凑的代码:

<section id="shout">
<button class="button shout"><a href="sms:?&body=mysite.com" class="shoutButton">Shout</a></button>
</section>

我正在使用外部 CSS 文件来设置页面和按钮的样式。它似乎适用于我试过的所有手机,所以这很酷。我已经研究过使用@media,但这似乎不是正确的方法,而且我尝试了其他方法但没有成功。我已经很顺利了,但我的技能不是很好,所以任何帮助将不胜感激。

谢谢:)

最佳答案

您将创建两个链接,并且只显示一个基于 CSS @media query 的链接.

/* Default Style (mobile first!) */
.phone { display:inline; }
.desktop { display:none; }


/* Desktops */
@media screen and (min-width:1024px) {
.phone { display:none; }
.desktop { display:inline; }
}
<section id="shout">
<button class="button shout phone">
<a href="sms:?&body=mysite.com" class="shoutButton">Shout from Phone</a>
</button>
<button class="button shout desktop">
<a href="mailto:something@something.com" class="shoutButton">Shout from Desktop</a>
</button>
</section>

关于javascript - 使用响应式设计将 href 短信更改为 href mailto?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41232209/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com