Differences

This shows you the differences between two versions of the page.

--- en:create:timer-display [21.12.2014 12:04] – [Show Other Content] alexander.ritter
+++ en:create:timer-display [12.01.2016 09:27] – [Show Other Content] admin
@@ Line 17: / Line 17: @@
-Only a text element with the following content (created in **Text Elements and Labels**) is required. This text elements is dragged into the respective questionnaire page when composing the questionnaire.
+Only a text element with the following content (created in **Text Elements and Labels**, //Display// as "HTML code") is required. This text elements is dragged into the respective questionnaire page when composing the questionnaire.
 <code javascript>
@@ Line 23: / Line 23: @@
 <!--
-// Function to show the buttons
+// Nach dem Laden der Seite das Script starten
-function showButtons() {
-  var buttons = document.getElementById("buttonsAuto");
-  // Restore normal display mode (show buttons)
-  buttons.style.display = "";
-}
-// Start the script after the page is loaded
 SoSciTools.attachEvent(window, "load",
   function() {
-    // Search the buttons
+    // Die Knöpfe ausblenden
-    var buttons = document.getElementById("buttonsAuto");
+    SoSciTools.submitButtonsHide();
-    // Hide the buttons
+    // Den Timer starten
-    buttons.style.display = "none";
+    window.setTimeout(SoSciTools.submitButtonsDisplay, 60000); // Nach 1 Min = 60.000 ms
-    // Start the time
-    window.setTimeout(showButtons, 60000); // after 1 Min = 60.000 ms
   }
 );
@@ Line 46: / Line 37: @@
 </code>
+**Note:** This JavaScript code makes use of the SoSci Survey specific function ''SoSciTools.submitButtonsHide()'' to hide all buttons. You may specifically identify the submit button via ''%%document.getElementById("submit0")%%'' and change it's attribute ''.style.display'' to ''%%"none"%%''. For having the button re-appear, it may be necessary to write an additional function that restores the attribute to the empty string ''%%.style.display = ""%%''.
 ===== Show Other Content =====
@@ Line 55: / Line 46: @@
 <code html>
-<div id="myObjective">
+<div id="myObject">
 <h1>Heading</h1>
 <p>You can read the secret text here.</p>
@@ Line 65: / Line 56: @@
 <code html>
-<div id="myQuestion">
+<div id="myObject">
 </code>
@@ Line 73: / Line 64: @@
 **Tip:** This is not necessary for questions because they already have an HTML ID ([[:en:create:dynamic|Immediately Show Questions when a Certain Option is Selected]]).
+The HTML/JavaScript code that takes care of hiding would look like this:
+<code html>
+<script type="text/javascript">
+<!--
+// Funktion zum Einblenden der Knöpfe
+function showContent() {
+  var content = document.getElementById("myObject");
+  // Den normalen Anzeigemodus wiederherstellen
+  content.style.display = "";
+}
+// Nach dem Laden der Fragebogen-Seite das Script starten
+SoSciTools.attachEvent(window, "load",
+  function() {
+    // Objekt heraussuchen
+    var content = document.getElementById("myObject");
+    // Ausblenden
+    content.style.display = "none";
+    // Den Timer starten
+    window.setTimeout(showContent, 60000); // Nach 1 Min = 60.000 ms
+  }
+);
+// -->
+</script>
+</code>