{"id":15699134,"url":"https://github.com/softwarespot/jquery-bootstrap-purr","last_synced_at":"2025-10-22T17:05:04.135Z","repository":{"id":36304622,"uuid":"40609232","full_name":"softwarespot/jquery-bootstrap-purr","owner":"softwarespot","description":"A jQuery plugin for displaying Bootstrap Alerts dynamically on your website","archived":false,"fork":false,"pushed_at":"2017-03-12T09:50:09.000Z","size":84,"stargazers_count":6,"open_issues_count":1,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-10-06T09:21:51.034Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"http://softwarespot.github.io/jquery-bootstrap-purr/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/softwarespot.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-08-12T15:41:55.000Z","updated_at":"2023-03-10T10:28:35.000Z","dependencies_parsed_at":"2022-08-31T00:01:46.995Z","dependency_job_id":null,"html_url":"https://github.com/softwarespot/jquery-bootstrap-purr","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/softwarespot%2Fjquery-bootstrap-purr","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/softwarespot%2Fjquery-bootstrap-purr/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/softwarespot%2Fjquery-bootstrap-purr/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/softwarespot%2Fjquery-bootstrap-purr/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/softwarespot","download_url":"https://codeload.github.com/softwarespot/jquery-bootstrap-purr/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221261126,"owners_count":16787234,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-03T19:38:35.946Z","updated_at":"2025-10-22T17:04:58.794Z","avatar_url":"https://github.com/softwarespot.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# jQuery-Bootstrap-Purr - v1.1.2\n\n\u003cp align=\"center\"\u003e\u003cimg src=\"https://cloud.githubusercontent.com/assets/5333690/9717379/eec41440-557a-11e5-890c-ea9785cd050c.gif\"/\u003e\u003c/p\u003e\n\nA jQuery plugin for displaying `Bootstrap Alerts` dynamically on your website.\n\n## What exactly is jQuery-Boostrap-Purr?\n\nHow many times have you written the following code to display an alert on the page? Quite a lot I should probably imagine. Surely there must be a better approach with using one line of JavaScript? Of course there is and it's called jQuery-Bootstrap-Purr.\n\n```html\n    \u003c!--START: Success alert markup--\u003e\n    \u003cdiv id=\"success-alert\" class=\"alert alert-success alert-dismissible fade in\" role=\"alert\"\u003e\n        \u003cbutton type=\"button\" class=\"close\" data-dismiss=\"alert\" aria-label=\"Close\"\u003e\n            \u003cspan aria-hidden=\"true\"\u003e\u0026times;\u003c/span\u003e\n            \u003cspan class=\"sr-only\"\u003eClose\u003c/span\u003e\n        \u003c/button\u003e\n        This is a simple \"purr\" which is draggable with the primary mouse\n    \u003c/div\u003e\n    \u003c!--END: Success alert markup--\u003e\n```\n\n```javascript\n    // Display the dismissible alert with id of '#success-alert'\n    var $alert = $('#success-alert').alert();\n```\n\nThis is where jQuery-Bootstrap-Purr really comes into a world of its own, as you can display a message with one single line and it does all the rest for you. Now it might not make your pages look overly 'swanky', but it sure would try if it could!\n\n```javascript\n    \u003c!--Use the minified version for better performance--\u003e\n    \u003cscript src=\"jquery-bootstrap-purr.min.js\"\u003e\u003c/script\u003e\n\n    \u003cscript\u003e\n        // Display an alert\n        $.bootstrapPurr('This is a simple \"purr\" that is draggable with the mouse. Drag me!');\n    \u003c/script\u003e\n```\n\n## How to install\n\nIf you use bower, then just copy and paste the following command to the shell window.\n```shell\n    bower install jquery-bootstrap-purr\n```\n\nOtherwise just include `jquery-bootstrap-purr.min.js` somewhere in your document, preferably after jQuery and Bootstrap (since it relies on these).\n\n### Requirements\n\nThe plugin assumes that the following libraries have been included beforehand.\n- jQuery 2.0.*\n- Bootstrap 3.*\n\n## Documentation\n\njQuery-Bootstrap-Purr has two parameters. The message to display inside the alert (HTML markup allowed) and/or optional `options`. Please see below for the available options.\n\n```javascript\n    $.bootstrapPurr(message, options [optional]);\n```\n\n### Options\n\nThe following options below can either be passed via the `options` parameter or by overriding the defaults using `$.bootstrapPurr.options.[PROPERTY]`, in which the property is substituted for a particular option.\n\n```javascript\n    {\n        // Default parent element to append the alert to\n        element: 'body',\n\n        // Type of alert. See Bootstrap documentation for any additional supported formats\n        type: 'info', // (null|'default', 'info', 'danger', 'success')\n\n        // Alert offset\n        offset: {\n            amount: 20, // (number)\n            from: 'top' // ('top', 'bottom')\n        },\n\n        // Alignment relative to the parent element\n        align: 'right', // ('left', 'right', 'center')\n\n        // With of the alert. The default is 250px, which is the same as Bootstrap's alerts\n        width: 250, // (number, 'auto')\n\n        // If true then a cross will be displayed in the top right hand corner of the alert\n        allowDismiss: true, // (true, false)\n\n        // Type of dismissal when 'allowDismiss' is set to true. If the type is 'hover' and 'draggable' is set to true,\n        // then 'draggable' will be ignored\n        allowDismissType: 'click', // ('click', 'hover')\n\n        // Options to pass to the .animate() function when displaying the an alert\n        animateShow: {\n            opacity: 'show', // See the animate() function in jQuery for more details\n            duration: 'fast'\n        },\n\n        // Options to pass to the .animate() function when closing the an alert\n        animateHide: {\n            opacity: 'hide', // See the animate() function in jQuery for more details\n            duration: 'slow'\n        },\n\n        // Delay for 'on fade out' in milliseconds\n        delay: 5000, // (number)\n\n        // Pause the delay when hovering over the alert\n        delayPause: false, // (true, false)\n\n        // Whether the alert should be draggable using the primary mouse button\n        draggable: true, // (true, false)\n\n        // Spacing between each new alert that is created\n        stackupSpacing: 10 // (number)\n    }\n```\n\n## Contribute\n\nTo contribute to the project, you will first need to install [node](https://nodejs.org) globally on your system. Once installation has completed, change the working directory to the plugin's location and run the following command:\n\n```shell\n    npm install\n```\n\nAfter installation of the local modules, you're ready to start contributing to the project. Before you submit your PR, please don't forget to call `gulp`, which will run against [ESlint](http://eslint.org) for any errors, but will also minify the plugin.\n\n##### Watch\nCall the following command to start 'watching' for any changes to the main JavaScript file(s). This will automatically invoke ESLint and Uglify.\n```shell\n    gulp watch\n```\n\n##### ESLint\nCall the following command to invoke ESLint and check that the changes meet the requirements set in .eslintrc.\n```shell\n    gulp eslint\n```\n\n##### Uglify\nCall the following command to invoke Uglify, which will minify the main JavaScript file(s) and output to a .min.js file respectively.\n```shell\n    gulp uglify\n```\n\n##### Build\nCall the following command to invoke both ESLint and Uglify.\n```shell\n    gulp\n```\n\n### Thanks\n\nThe following jQuery plugin started life as a `fork` of [bootstrapGrowl](https://github.com/ifightcrime/bootstrap-growl/), but over time it became clear the direction 'Purr' was going in, was outside the scope of 'Growl'. Therefore I would like to extend a special thanks to the contributors of [bootstrapGrowl](https://github.com/ifightcrime/bootstrap-growl/), for making this new plugin possible.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsoftwarespot%2Fjquery-bootstrap-purr","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsoftwarespot%2Fjquery-bootstrap-purr","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsoftwarespot%2Fjquery-bootstrap-purr/lists"}