diff --git a/node/src/documents/index.html.eco b/node/src/documents/index.html.eco
index 06079cd37..4e0da6cdb 100755
--- a/node/src/documents/index.html.eco
+++ b/node/src/documents/index.html.eco
@@ -135,6 +135,7 @@ type : 'Semantic'
Semantic provides tracing for javascript behavior so your components can tell you what they're doing as they do it.
+ $.fn.transition.settings.debug = true;
$('.dog.image')
.transition('scale in')
.transition('tada', '800ms')
diff --git a/node/src/documents/modules/popup.html.eco b/node/src/documents/modules/popup.html.eco
index 59b9e10f0..7d2e3a3c4 100755
--- a/node/src/documents/modules/popup.html.eco
+++ b/node/src/documents/modules/popup.html.eco
@@ -26,7 +26,7 @@ type : 'UI Module'
@@ -34,14 +34,14 @@ type : 'UI Module'
A popup can be large or small
-
-
+
+
A popup can have its colors inverted
-
+
@@ -69,40 +69,65 @@ type : 'UI Module'
-
+
+
+
+
A popup can either be inserted directly after an element, or added as a child element to the page's body
.
+
+ An inline popup will remain in your page's html after being hidden, while a non-inline popup will remove itself after being hidden.
+
+
+ If you want to style each popup individually it makes sense to keep popup inline: true
. If you are worried that your pop up might mistakingly inherit styles that it shouldn't, you should set inline: false
.
+
+
+ $('.page.icon')
+ .popup({
+ inline: false
+ })
+ ;
+ $('.inline.icon')
+ .popup({
+ inline: true
+ })
+ ;
+
+
+
+
+
A popup can be positioned to any side of an element. If space is not available, it will automatically search for a similar alternative position to use.
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
A popup can be formatted with a title
-
+
A popup can be formatted with html
-
+
A popup can have different transitions. Any transition with both an in and out animation can be specified. The following are just a few examples.
-
+
$('.fade.icon')
@@ -112,7 +137,7 @@ type : 'UI Module'
-
+
$('.slide.icon')
@@ -122,7 +147,7 @@ type : 'UI Module'
-
+
$('.flip.icon')
@@ -235,7 +260,7 @@ type : 'UI Module'
- onInit |
+ onCreate |
None |
Callback after a popup html is generated. |
diff --git a/node/src/files/javascript/popup.js b/node/src/files/javascript/popup.js
index 17c0ccfc1..bb9da2c4c 100755
--- a/node/src/files/javascript/popup.js
+++ b/node/src/files/javascript/popup.js
@@ -5,7 +5,7 @@ semantic.accordion.ready = function() {
// selector cache
var
- $popup = $('.example .help.icon'),
+ $popup = $('.example .heart.icon'),
// alias
handler
;
diff --git a/node/src/files/javascript/semantic.js b/node/src/files/javascript/semantic.js
index babf72bff..338bcf3e7 100755
--- a/node/src/files/javascript/semantic.js
+++ b/node/src/files/javascript/semantic.js
@@ -63,7 +63,6 @@ semantic.ready = function() {
handler
;
- $.fn.transition.debug = true;
// event handlers
handler = {