我们在QQ空间里面有一个送礼物的功能，显示了最近过生日的人。我们只要把鼠标放到如下图的生日快乐那标签上，就会显示可以给该人送的礼物！！
如下图所示：
单击其中的一个礼物，就会马上送出去。但是我们现在是要说的还有单击更多的时候，会另外弹出一个新的窗口在当前页面最前面！如下图显示：
怎么实现那上面的功能呢？
就是把鼠标放上去，弹出一天tips，单击tips里面的控件，之后弹出另外一个弹出框。
网上就会有很多比较好的插件，就先到网上去找了相对应的jquery插件。
jquery中tips的有很多插件，但是大部分都是跟随鼠标走的，你离开那个指定的位置就会消失。现在这个是把鼠标是要可以放到弹出的tips上面的。之后发现了一款符合需求又很强大的tips插件poshytip。poshytip使用简单，它还可以支持ajax来动态的加载内容来的，就可以通过数据库来调用指定分类的礼物出来了。
更多的poshytip示例和演示在：http://vadikom.com/demos/poshytip/
还需要一个弹出层的，为了更容易的去实现，把弹出层另外新作了一个页面，点击更多的时候在当前窗口加载另外一个新的页面作为弹出层。
弹出层的很多，用colorbox等其它jquery插件。直接只用使用之后，发现弹出来的窗口说链接错误！或者被取消弹出层等。那是因为我们在单击了更多的时候，弹出了一个新的窗口，鼠标离开了tips弹出来的窗口，这时候那tips出来的就会消失，而弹出加载另外的页面的被取消了。
那是要我自己来弄一个弹出层插件来了么，能写当然好 。对于不是js告诉来，找一款比较简单的来定制不是更快捷。这里https://www.jb51.net/article/84902.htm比较秀珍的弹出层插件。使用和修改起来也非常方便了。
用poshytip的方法loadposhytip里面加载了内容后就给绑定给更多绑定popdialog方法。只要我们就可以实现那功能了。
实现的方式就是那样的了，下面是我使用的部分js代码
function loadRecommenClick() {
if ($("#floatBoxBg").length == 0) {
$(".moreRecommend").PopDialog({
Event: "click", //触发响应事件
title: "送礼物", //弹出层的标题
content: "/peoplename/toPeople.aspx", //弹出层的内容获取(text文本、容器ID名称、URL地址、Iframe的地址)
width: 630, //弹出层的宽度
height: 400, //弹出层的高度
scrollTop: 200 //层滑动的高度也就是弹出层时离顶部滑动的距离
});
}
}
function loadposhytip(currClass) {
$("." + currClass).poshytip({
className: 'tip-yellowsimple',
content: function (updateCallback) {
classId = $(this).attr("classId");
var htmss = "";
$.getJSON(gifturl + '"&r=" + Math.random(),
function (data) {
var container = "<div id=\"sphtml\" class=\"giftInfo1\">";
container += "<div> 精选好礼，点击就可赠送哦！</div>";
container += "<div class=\"birthdayGift\">";
$.each(data[0].items, function (i, item) {
container += " <img src=\"" + item.pic + "\" alt=\"送此件礼物给\" onclick=\"sendgift(this)\" gid=\"" + item.id + "\" yulu=\"" + item.defaultYulu + "\"/>";
});
container += "</div>";
container += "<div class=\"moreRecommend\" >更多推荐</div>";
container += "</div>";
if (data[0].count == "0")
container = "还没有添加礼品，请联系管理员添加！";
updateCallback(container);
}
);
return "加载中.....";
},
alignTo: 'target',
alignX: 'center',
alignY: 'bottom',
offsetX: 0,
offsetY: 5
});
loadRecommenClick();
}
由于这是用在项目中去了，没有做出demo出来，我就只上图两种了。其中礼物都是通过数据库添加的，ajax加载出来的。
以上所述是小编给大家介绍的基于jQuery实现仿QQ空间送礼物功能代码的相关知识，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
3月27日消息，苹果宣布2024年全球开发者大会（WWDC）将于6月10日至6月14日举行，巧合的是，这次大会与端午假期重合。
苹果官方表示：
在线参加 Apple 每年规模最大的开发者盛会。亲眼见证 Apple 最新平台、技术和工具的发布。了解如何创建和改进你的 App 和游戏。与 Apple 设计师和工程师互动交流，与全球开发者社区建立联系。以上活动均免费在线举行。
探索各种新的工具、框架和功能，助力你打造出理想的 App 和游戏。通过视频讲座学习新技能，与 Apple 专家进行一对一会面，以推进你的项目，完善你的构思。
Swift Student Challenge 旨在支持和鼓舞下一代开发者、创作者和企业家。太平洋时间 3 月 28 日，我们将公布今年的获奖者名单。获奖者将有资格参加在 Apple Park 举办的特别活动。我们还会选出 50 名杰出获胜者，他们将受邀前往库比提诺，获得为期三天的非凡体验，包括参加 Apple Park 的特别活动。
RTX 5090要首发 性能要翻倍！三星展示GDDR7显存
三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。
首次推出的GDDR7内存模块密度为16GB，每个模块容量为2GB。其速度预设为32 Gbps（PAM3），但也可以降至28 Gbps，以提高产量和初始阶段的整体性能和成本效益。
据三星表示，GDDR7内存的能效将提高20%，同时工作电压仅为1.1V，低于标准的1.2V。通过采用更新的封装材料和优化的电路设计，使得在高速运行时的发热量降低，GDDR7的热阻比GDDR6降低了70%。