All Projects → lukasz-brzostek → corner-popup

lukasz-brzostek / corner-popup

Licence: other
jQuery pop-up script displaying various types of content in corner of browser

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects

Projects that are alternatives of or similar to corner-popup

Swiftentrykit
SwiftEntryKit is a presentation library for iOS. It can be used to easily display overlays within your iOS apps.
Stars: ✭ 5,706 (+24708.7%)
Mutual labels:  popup, messages
neodigm55
An eclectic low-code vanilla JavaScript UX micro-library for those that defiantly think for themselves.
Stars: ✭ 14 (-39.13%)
Mutual labels:  popup, popups
craft-cookies
A simple plugin for setting and getting cookies from within Craft CMS templates.
Stars: ✭ 36 (+56.52%)
Mutual labels:  cookies
fuckfuckadblock
Filters for blocking pop-ups and anti-adblock bypass.
Stars: ✭ 983 (+4173.91%)
Mutual labels:  popup
message-indicator
🔵 SIMBL plugin that adds an indicator to messages in which you haven't responded
Stars: ✭ 21 (-8.7%)
Mutual labels:  messages
Client-Storage
🗄 Bulletproof persistent Client storage, works with disabled Cookies and/or localStorage
Stars: ✭ 15 (-34.78%)
Mutual labels:  cookies
rn-circle-quick-actions
React Native library to display a modal popup quick actions menu
Stars: ✭ 41 (+78.26%)
Mutual labels:  popup
nativescript-menu
A plugin that adds a pop-up menu to NativeScript
Stars: ✭ 17 (-26.09%)
Mutual labels:  popup
MaterialDesign-Toast
Custom android Toast with Material Design
Stars: ✭ 70 (+204.35%)
Mutual labels:  popup
ChristmasSpiritBreaker-andNewYearsToo
Python script which automatically sends Christmas/New Year's messages from a custom messages list on Whatsapp, Facebook Messenger or via SMS in a given time range, to a custom contacts list. Time to work smart, not hard.
Stars: ✭ 81 (+252.17%)
Mutual labels:  messages
aqua
A minimal and fast 🏃 web framework for Deno
Stars: ✭ 219 (+852.17%)
Mutual labels:  cookies
macaroon
Rust implementation of macaroons.
Stars: ✭ 16 (-30.43%)
Mutual labels:  cookies
Xamarin-Forms-Popup-Demo
Sample Xamarin Forms app for using Popups
Stars: ✭ 20 (-13.04%)
Mutual labels:  popup
SKChoosePopView
SKChoosePopView是一个HUD风格的可定制化选项弹窗的快速解决方案,集成了上、下、左、右、中5个进场方向的6种动画效果,如果不能满足你对酷炫效果的需要,SKChoosePopView同样支持自定义动画,以及选择记录、动画的开闭、点击特效、行列数量控制等
Stars: ✭ 70 (+204.35%)
Mutual labels:  popup
android-chat-tutorial
Sample apps for the Stream Chat Android SDK's official tutorial
Stars: ✭ 44 (+91.3%)
Mutual labels:  messages
react-redux-modal-flex
[DEPRECATED] Make easy a modal/popup with Redux
Stars: ✭ 14 (-39.13%)
Mutual labels:  popup
SimpleDialogs
💬 A simple framework to help displaying dialogs on a WPF app
Stars: ✭ 24 (+4.35%)
Mutual labels:  messages
eins-modal
Simple to use modal / alert / dialog / popup. Created with pure JS. No javascript knowledge required! Works on every browser and device! IE9
Stars: ✭ 30 (+30.43%)
Mutual labels:  popup
Ambar-Xamarin
A macOS Menu Bar app built with Xamarin and C#
Stars: ✭ 63 (+173.91%)
Mutual labels:  popup
koa-better-error-handler
A better error-handler for Lad and Koa. Makes `ctx.throw` awesome (best used with koa-404-handler)
Stars: ✭ 51 (+121.74%)
Mutual labels:  messages

Corner Popup v1.30

Fully customizable pop-up box created to display all types of messages in corner of your browser.

Website: https://espritdesign.pl/corner-popup
Demo: https://espritdesign.pl/corner-popup/demo

More about Corner Popup

What is Corner Popup? It's a simple pop-up component that can be used on almost all modern websites. It simply displays small pop-up box in corner of browser. Corner Popup is fully configurable and you can change many parameters - position, window color, content inside etc. Corner Popup is easy to use and you don't need any programming skills. As a component Corner Popup needs only jQuery to work. It is fully responsive without using any framework.

How to use

Using Corner Popup is very simple. As the first step, add jQuery and Corner Popup files for the project (remember to add appropriate files to folders):

<link rel="stylesheet" href="css/corner-popup.min.css">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="js/corner-popup.min.js"></script>

In step 2 call script from your website code:

<script>
$.fn.cornerpopup({
});
</script>

In step 3 you can (but it's not necessary) set some options in previously added code:

<script>
$.fn.cornerpopup({
variant: 1,
slide: 1
});
</script>

All available options with description:

Option Default Description
active true Makes popup enabled or disabled. If it is set to 1 popup will show. If set to 0 it's disabled.
displayOnce false If this option is set to 1, the popup will be displayed only once (which is stored in browser memory).
variant 1 Using this option you can set a variant of the popup window. There are 10 variants which could be used for different purposes - for example variant 2 is an option used for cookies information - it even creates and saves cookie for you.
slide false If this option is set to 1 standard method of showing a popup (fade) will change to slide.
slideTop false This option could be used only if "slide" is set to 1. It makes slide always work from bottom to top.
delay 0 This option sets delay to popup. It will appear after the amount of time you set as parameter (in milliseconds).
timeOut 0 This option sets the timeout to popup, so it will appear and disappear after the amount of time you set as parameter. If you set for example 500 it will disappear after 500ms.
closeBtn true Sets close button visibility - if it is set to 0 close button will not show in any variant of the popup.
shadow true Sets popup shadow visibility - if it is set to 0 shadow won't be visible in any variant of the popup.
link1 You can change the link that is used in variant 1 of popup. Just type a new address as first parameter and target as second - e.g. link1: "https://espritdesign.pl, _blank".
link2 # You can change the link that is used in most of popup variants. Just type a new address as first parameter and target as second - e.g. link2: "https://espritdesign.pl, _blank".
popupImg You can change the image used in popup variant 1. Type your own link to image here.
cookieImg You can change the image used in popup variant 2 (cookies). Type your own link to image here.
messageImg You can change the image used in popup variant 3 (message). Type your own link to image here.
header In this option you can change header used in some of popup variants. You can use html tags here.
text1 In this 2 options you can change text used in popup variants - text1 is for cookie message. You can use html tags here.
button1, button2, button3 In this 3 options you can change label used in the buttons. "button2" is used in cookies popup.
content You can place in this option text (including html tags) which is displayed in variant nr.10 of popup - this variant is made to show your own content.
loadContent false This option loads data from another file (e.g. html file with prepared content). Just write the file address as parameter.
width 390px This option is used to change the popup width. Use here css units.
font This option is used to change the font used in popup elements. Use here css code - e.g. "'Open Sans', 'Halvetica', sans-serif".
colors #543189 This option changes color of primary elements - close button icon, headers, buttons.
bgColor #fff This option changes background color of popup.
borderColor #efefef This option changes border color of popup.
textColor #181818 This option changes text color in popup.
iconColor #543189 This option changes close button color.
btnColor #543189 This option changes color of buttons in popup.
btnTextColor #fff This option changes color of text in buttons.
corners 0px This option is used to change popup corner radius.
position right This option is used to change position of the popup. You can change position to left, center or right.
padding 0 This option is used to change padding inside of the popup. You can change it to any value.
escClose false Closes pop-up window after Escape key is pressed. This option works if it is set to 1.
topCorner false Makes the pop-up appear at the top of the browser window. Works if it is set to 1.
stickToBottom false Removes the pop-up margin and makes it stick to the edge of the browser. Works if it is set to 1.

Corner Popup provides public methods (e.g. usage):

$.fn.cornerpopup.popupClose();
Method Description
popupClose Closes pop-up window whenever you want.
popupHide Hides pop-up window (it can be restored at any time).
popupShow Shows hidden pop-up window.

You can add delay for each method. Just call the method like this: $.fn.cornerpopup.popupShow(100); - where 100 is the time in milliseconds.

Corner Popup events:

<script>
$.fn.cornerpopup({
variant: 1,
beforePopup: function() {
// Your code here
}
</script>
Event Description
beforePopup Your code will work before the popup window appears.
afterPopup Your code will work after closing the pop-up window.
onBtnClick Your code will work after pressing the popup button.

License

Corner Popup is licensed under the Creative Commons Attribution 4.0 International License: https://creativecommons.org/licenses/by/4.0

Author

Łukasz Brzostek

Have a question about usage? Found a bug?
Feel free to write a message to me: [email protected]

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].