仿ios风格的提示和通知

所属分类:UI-弹出层,加载,工具提示

 48757  448  查看评论 (16)
分享到微信朋友圈
X
仿ios风格的提示和通知 ie兼容7

iosOverlay.js 用于在 Web 项目中实现 iOS 风格的通知和提示效果。为了防止图标加载的时候闪烁,你需要预加载的图像资源。不兼容 CSS 动画的浏览器需要 jQuery 支持。浏览器兼容:IE7+, Google Chrome, Firefox, Opera, Desktop Safari, Mobile Safari — iPhone & iPad。


参数和默认值

onbeforeshownoop();Function
onshownoop();Function
onbeforehidenoop();Function
onhidenoop();Function
textnullString
iconnullString (file path)
spinnernullSpinner (via Spin.js)
durationnullNumber (ms)

调用方法

hide执行此方法将隐藏提示通知.
  // notification is called
  var notification = ...;

  // something happens

  // fade out notification and destroy on complete
  notification.hide();
update执行将更新提示通知的内容。
  // notification is called
  var notification = ...;

  // something happens

  // notification is updated
  notification.update({
    text: "Success!",
    icon: "img/smiley.png"
  });
相关插件-弹出层,加载,工具提示

jQuery弹框、弹出层插件method.js

jq弹框 弹框标题、内容、宽高、取消确认按钮、关闭按钮、动效类型均可以参数的形式设置
  弹出层
 51388  398

jquery鼠标悬停滑动切换特效

jquery鼠标悬停滑动切换特效
  弹出层
 32492  387

jQuery图像展示插件Strip

Strip是Lightbox的一种,它只能部分覆盖页面。这样就不会占用大的屏幕面积,适用于比较小的移动设备
  弹出层
 32063  391

jQuery弹出层插件

可无限次弹出,自己设置大小,手动调整大小都可(相比于layer.js要轻量)
  弹出层
 38689  318

讨论这个项目(16)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    CptyunStudio 0
    2020/2/16 21:22:22
    这直接把原作者的东西(包括展示页)搬过来发布不太好吧 回复
    鱼娃娃 0
    2018/9/27 17:28:50
    #上善若水# 0
    2017/10/25 19:08:07
    yinzhixin 0
    2017/6/9 23:52:19

    设置启用遮罩不管用呢

        0
        2018/4/27 14:43:53
        您设置遮罩层成功了么?
        1
        2018/4/27 14:52:09
        var overlay = iosOverlay({
            text: "Loading",
            spinner: spinner,
            onbeforeshow: showDiv,
            onbeforehide: closeDiv
        });

        这里,我搞定了。

    回复
    ?? 天缺 0
    2016/10/26 11:10:02
    海纳百川001 0
    2016/9/8 11:09:54
    各位大牛,请问怎么用,引入哪些文件,怎么调用?
        xiwang64280
        2016/9/8 11:09:49
        查看演示,里面写得很清楚了。
    回复
    W先生 0
    2016/4/22 18:04:51
    感谢分享,谢谢 回复
    翩若惊鸿 0
    2016/3/28 17:03:43
    高大上的提示图标啊 回复
    水落无声 0
    2015/11/2 15:11:54

    这个还是不错的,用了

    回复
    狼之城 0
    2015/9/7 14:09:32

    很棒 用着不错 


    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复