update_image_ani

app/templates/survey_question.html

@@ -76,13 +76,11 @@
             align-items: center;
         }
         .pokemon-image {
-            width: 150px;
-            height: 150px;
-            margin-bottom: 10px;
-        }
-        .pokemon-image {
-            width: 300px; /* Adjust the width as needed */
-            height: auto; /* Maintain aspect ratio */
+            width: auto; /* Adjust the width as needed */
+            height: 300px; /* Maintain aspect ratio */
+            background-color: #ffffff; /* White background fill */
+            opacity: 0; /* Initially hide the image */
+            transition: opacity 0.5s ease-in-out; /* Smooth transition for showing the image */
         }
     </style>
 </head>
@@ -113,6 +111,12 @@
     </form>
     <script>
         let question_id = String({{ question_id }});
+
+        document.getElementById('pokemonImage').addEventListener('load', function() {
+            this.style.opacity = '1';
+            this.style.backgroundColor = 'transparent'; // Remove the background color after image loads
+        });
+
         function submitForm(fieldName, fieldValue) {
             // disable all buttons
             let buttons = document.querySelectorAll('.options button');

dataset/心情量表/records.csv

@@ -1 +1,4 @@
-
+使用者,score
+o6qodHgL3ebtJg2iNbEsC2dBQUFBQUJtdkdEd0xoaTJDTE9wVnJvN0RtakJwYWJJMmVWaERDVE5Jci13WDZjdmNVZVBVcTlmYkZsVTZrRGlMSTZ3MXJHYnNuZ1ZBQXc4SVYyLVZpd2tyNl9fX2JJU0JBPT0=,15
+lsLaA_aYUoUYz2XUvRtpBWdBQUFBQUJtdkdENmhZeVFqWmZaWjN3MEJaYXVQS2ZMZC0xeWYwbi13Y2pmTk94MTJ3RHd6bElPUUNwSTFqMlUzUWNxdkNMRXlJVWNleVFTS2hwWUZqN0ZTcHNPWkk2U1lRPT0=,15
+1fGsOGI5YR-AznOiiA1h9GdBQUFBQUJtdkdFeFlTRk1RRG5DMURlVnlMNWptLXdOeHRES29rMzE0RG1SX1VKOVU1OEd5OGtia0FJaVl2T3FfZWFENUkxZGdYQjZYQ3dMVWlSV1JzVW5lTmVlN0tha3dRPT0=,16