Preventing FOUC

diff --git a/docs/pages/dropdown-menu.md b/docs/pages/dropdown-menu.md
index 809ef65fe66fed942989aecbb4e49e88b294e56c..f95c0d1088ce02869743c1e2daa6360f95017ac3 100644 (file)
--- a/docs/pages/dropdown-menu.md
+++ b/docs/pages/dropdown-menu.md
@@ -152,3 +152,24 @@ Add the `.vertical` class to the top-level menu to make it vertical. Sub-menus a
 ## Sticky Navigation
 
 See the documentation for the [Sticky](sticky.html#sticky-navigation) plugin to see how to easily make a sticky nav bar. 
+
+---
+
+### Preventing FOUC
+
+Before the JavaScript on your page loads, the dropdown menus will not have arrows. However, once the JavaScript file has loaded, the arrows will appear causing a [flash of unstyled content](https://en.wikipedia.org/wiki/Flash_of_unstyled_content). You can prevent this by adding the `.is-dropdown-submenu-parent` class manually. 
+
+```html
+<ul class="dropdown menu" data-dropdown-menu>
+  <li class=".is-dropdown-submenu-parent">
+    <a href="#">Item 1</a>
+    <ul class="menu">
+      <li><a href="#">Item 1A</a></li>
+      <!-- ... -->
+    </ul>
+  </li>
+  <li><a href="#">Item 2</a></li>
+  <li><a href="#">Item 3</a></li>
+  <li><a href="#">Item 4</a></li>
+</ul>
+```
\ No newline at end of file