Commits

Bertrand Bordage  committed c076246

Put HTML description in an HTML tag and copies it to img title using JS.

This allows for complex HTML titles.

  • Participants
  • Parent commits be8d5be

Comments (0)

Files changed (1)

File cmsplugin_nivoslider/templates/nivo/slider.html

     <script type="text/javascript" src="{{STATIC_URL}}nivo/js/jquery.nivo.slider.pack.js"></script>
 {% endaddtoblock %}
 
-{% addtoblock "js" %}
-    <script type="text/javascript">
-        $(function() {
-            $('#nivoslider{{object.pk}}').nivoSlider({
-                effect: '{{object.effect}}',
-                animSpeed: {{object.anim_speed}},
-                pauseTime: {{object.pause_time}},
-                directionNav: {{object.arrows|lower}},
-                controlNavThumbs: {{object.thumbnails|lower}},
-                pauseOnHover: {{object.pause_on_hover|lower}},
-                manualAdvance: {{object.manual_advance|lower}},
-                prevText: '{% trans 'prev'|capfirst %}',
-                nextText: '{% trans 'next'|capfirst %}',
-                randomStart: {{object.random_start|lower}}
-            });
-        });
-    </script>
-{% endaddtoblock %}
-
 <div    class="slider-wrapper theme-{{object.theme}}"
         {% if object.width %}
             style="width: {{object.width}}px;"
                 style="height: {{object.height}}px;"
             {% endif %}>
         {% for img in images %}
-            <img    src="{{img.image.url}}"
+            <img    id="nivo-slide{{img.pk}}-image"
+                    src="{{img.image.url}}"
                     data-thumb="{{ img.image.icons.64 }}"
-                    alt="{{img.name|default:''}}"
-                    title="{{img.description|default:''}}" />
+                    alt="{{img.name|default:''}}" />
+            <div id="nivo-slide{{img.pk}}-text">
+                {{img.description|default:''|safe}}
+            </div>
         {% endfor %}
     </div>
 </div>
+
+{% for img in images %}
+    <script type="text/javascript">
+        var image = document.getElementById("nivo-slide{{img.pk}}-image");
+        var text = document.getElementById("nivo-slide{{img.pk}}-text");
+        image.title = text.innerHTML;
+        text.parentNode.removeChild(text);
+    </script>
+{% endfor %}
+
+<script type="text/javascript">
+    $(function() {
+        $('#nivoslider{{object.pk}}').nivoSlider({
+            effect: '{{object.effect}}',
+            animSpeed: {{object.anim_speed}},
+            pauseTime: {{object.pause_time}},
+            directionNav: {{object.arrows|lower}},
+            controlNavThumbs: {{object.thumbnails|lower}},
+            pauseOnHover: {{object.pause_on_hover|lower}},
+            manualAdvance: {{object.manual_advance|lower}},
+            prevText: '{% trans 'prev'|capfirst %}',
+            nextText: '{% trans 'next'|capfirst %}',
+            randomStart: {{object.random_start|lower}}
+        });
+    });
+</script>