aboutsummaryrefslogtreecommitdiff
path: root/files/it/web/svg/element/animate
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:17 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:42:17 -0500
commitda78a9e329e272dedb2400b79a3bdeebff387d47 (patch)
treee6ef8aa7c43556f55ddfe031a01cf0a8fa271bfe /files/it/web/svg/element/animate
parent1109132f09d75da9a28b649c7677bb6ce07c40c0 (diff)
downloadtranslated-content-da78a9e329e272dedb2400b79a3bdeebff387d47.tar.gz
translated-content-da78a9e329e272dedb2400b79a3bdeebff387d47.tar.bz2
translated-content-da78a9e329e272dedb2400b79a3bdeebff387d47.zip
initial commit
Diffstat (limited to 'files/it/web/svg/element/animate')
-rw-r--r--files/it/web/svg/element/animate/index.html115
1 files changed, 115 insertions, 0 deletions
diff --git a/files/it/web/svg/element/animate/index.html b/files/it/web/svg/element/animate/index.html
new file mode 100644
index 0000000000..b5fa44b0cc
--- /dev/null
+++ b/files/it/web/svg/element/animate/index.html
@@ -0,0 +1,115 @@
+---
+title: <animate>
+slug: Web/SVG/Element/animate
+tags:
+ - Animazione SVG
+ - Elemento
+ - SVG
+translation_of: Web/SVG/Element/animate
+---
+<div>{{SVGRef}}</div>
+
+<div>L'elemento SVG  <code>animate</code> è usato per animare un attributo o una proprietà di un elemento nel tempo.</div>
+
+<div>Normalmente viene inserito dentro l'elemento o viene inserito un riferimento con l'attributo <code>href</code> dell'elemento bersaglio.</div>
+
+<h2 id="Uso">Uso</h2>
+
+<p>{{svginfo}}</p>
+
+<h2 id="Attributi">Attributi</h2>
+
+<h3 id="Attributi_globali">Attributi globali</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Conditional_processing_attributes">Attributi di elaborazione condizionale</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Core_attributes">Attributi principali</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Animation_event_attributes">Attributi dell'evento dell'animazione</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#XLink_attributes">Attributi Xlink</a> »</li>
+ <li><a href="en-US/docs/Web/SVG/Attribute#AnimationAttributeTarget">Attributi bersaglio degli attributi di animazione</a>  »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Animation_timing_attributes">Attributi del tempo dell'animazione</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Animation_value_attributes">Attributi dei valori dell'animazione</a> »</li>
+ <li><a href="/en-US/docs/Web/SVG/Attribute#Animation_addition_attributes">Attributi aggiuntivi dell'animazione</a> »</li>
+ <li>{{SVGAttr("externalResourcesRequired")}}</li>
+</ul>
+
+<h3 id="Attributi_specifici">Attributi specifici</h3>
+
+<ul>
+ <li>{{SVGAttr("attributeName")}}</li>
+ <li>{{SVGAttr("attributeType")}}</li>
+ <li>{{SVGAttr("from")}}</li>
+ <li>{{SVGAttr("to")}}</li>
+ <li>{{SVGAttr("dur")}}</li>
+ <li>{{SVGAttr("repeatCount")}}</li>
+</ul>
+
+<h2 id="Interfaccia_DOM">Interfaccia DOM</h2>
+
+<p>Questo elemento implementa l'interfaccia <code><a href="/en-US/docs/Web/DOM/SVGAnimateElement">SVGAnimateElement</a></code>.</p>
+
+<h2 id="Esempio">Esempio</h2>
+
+<h3 id="SVG">SVG</h3>
+
+<pre class="brush: html; highlight[6-7]">&lt;?xml version="1.0"?&gt;
+&lt;svg width="120" height="120" viewBox="0 0 120 120" version="1.1"
+ xmlns="http://www.w3.org/2000/svg"&gt;
+
+ &lt;rect x="10" y="10" width="100" height="100"&gt;
+ &lt;animate attributeType="XML" attributeName="x" from="-100" to="120"
+ dur="10s" repeatCount="indefinite"/&gt;
+ &lt;/rect&gt;
+&lt;/svg&gt;</pre>
+
+<h3 id="Risultato">Risultato</h3>
+
+<p>{{EmbedLiveSample("Example", 120, 120)}}</p>
+
+<h2 id="Problemi_di_accessibilità">Problemi di accessibilità</h2>
+
+<p><span style="">L'animazione lampeggiante e lampeggiante può essere problematica per le persone con problemi cognitivi come il disturbo da deficit di attenzione e iperattività (ADHD). Inoltre, alcuni tipi di movimento possono essere un fattore scatenante per i disordini vestibolari, l'epilessia e l'emicrania e la sensibilità scozzese. Prendi in considerazione la possibilità di fornire un meccanismo per mettere in pausa o disattivare l'animazione e utilizzare la Query media di movimento ridotto per creare un'esperienza gratuita per gli utenti che hanno espresso la preferenza per nessuna esperienza animata.</span> <span style="">L'animazione lampeggiante e lampeggiante può essere problematica per le persone con problemi cognitivi come il disturbo da deficit di attenzione e iperattività (ADHD). Inoltre, alcuni tipi di movimento possono essere un fattore scatenante per i disordini vestibolari, l'epilessia e l'emicrania e la sensibilità scozzese. Prendi in considerazione la possibilità di fornire un meccanismo per mettere in pausa o disattivare l'animazione e utilizzare la Query media di movimento ridotto per creare un'esperienza gratuita per gli utenti che hanno espresso la preferenza per nessuna esperienza animata.</span> <span style="">L'animazione lampeggiante e lampeggiante può essere problematica per le persone con problemi cognitivi come il disturbo da deficit di attenzione e iperattività (ADHD). Inoltre, alcuni tipi di movimento possono essere un fattore scatenante per i disordini vestibolari, l'epilessia e l'emicrania e la sensibilità scozzese. Prendi in considerazione la possibilità di fornire un meccanismo per mettere in pausa o disattivare l'animazione e utilizzare la Query media di movimento ridotto per creare un'esperienza gratuita per gli utenti che hanno espresso la preferenza per nessuna esperienza animata.</span> <span style="">L'animazione lampeggiante e lampeggiante può essere problematica per le persone con problemi cognitivi come il disturbo da deficit di attenzione e iperattività (ADHD). Inoltre, alcuni tipi di movimento possono essere un fattore scatenante per i disordini vestibolari, l'epilessia e l'emicrania e la sensibilità scozzese. Prendi in considerazione la possibilità di fornire un meccanismo per mettere in pausa o disattivare l'animazione e utilizzare la Query media di movimento ridotto per creare un'esperienza gratuita per gli utenti che hanno espresso la preferenza per nessuna esperienza animata.</span> <span style="">L'animazione lampeggiante e lampeggiante può essere problematica per le persone con problemi cognitivi come il disturbo da deficit di attenzione e iperattività (ADHD). Inoltre, alcuni tipi di movimento possono essere un fattore scatenante per i disordini vestibolari, l'epilessia e l'emicrania e la sensibilità scozzese. Prendi in considerazione la possibilità di fornire un meccanismo per mettere in pausa o disattivare l'animazione e utilizzare la Query media di movimento ridotto per creare un'esperienza gratuita per gli utenti che hanno espresso la preferenza per nessuna esperienza animata.</span> L'animazione lampeggiante può essere problematica per le persone con problemi cognitivi come il disturbo da deficit di attenzione e iperattività (ADHD). Inoltre, alcuni tipi di movimento possono essere un fattore scatenante per i disordini vestibolari, l'epilessia e l'emicrania e la sensibilità scozzese.<br>
+ <br>
+ Prendi in considerazione la possibilità di fornire un meccanismo per mettere in pausa o disattivare l'animazione e utilizzare la <a href="/en-US/docs/Web/CSS/@media/prefers-reduced-motion">Query multimediale a movimento ridotto</a> per creare un'esperienza gratuita per gli utenti che hanno espresso la preferenza per nessuna esperienza animata.</p>
+
+<p>Articoli in inglese sull'argomento:</p>
+
+<ul>
+ <li><a href="https://alistapart.com/article/designing-safer-web-animation-for-motion-sensitivity">Designing Safer Web Animation For Motion Sensitivity · An A List Apart Article </a></li>
+ <li><a href="https://css-tricks.com/introduction-reduced-motion-media-query/">An Introduction to the Reduced Motion Media Query | CSS-Tricks</a></li>
+ <li><a href="https://webkit.org/blog/7551/responsive-design-for-motion/">Responsive Design for Motion | WebKit</a></li>
+ <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Operable#Guideline_2.2_%E2%80%94_Enough_Time_Provide_users_enough_time_to_read_and_use_content">MDN Understanding WCAG, Guideline 2.2 explanations</a></li>
+ <li><a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/time-limits-pause.html">Understanding Success Criterion 2.2.2  | W3C Understanding WCAG 2.0</a></li>
+</ul>
+
+<h2 id="Specifiche">Specifiche</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Specifica</th>
+ <th scope="col">Stato</th>
+ <th scope="col">Commento</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{SpecName("Animazioni SVG 2", "#AnimateElement", "&lt;animate&gt;")}}</td>
+ <td>{{Spec2("SVG Animations 2")}}</td>
+ <td>Nessun cambiamento</td>
+ </tr>
+ <tr>
+ <td>{{SpecName("SVG1.1", "animate.html#AnimateElement", "&lt;animate&gt;")}}</td>
+ <td>{{Spec2("SVG1.1")}}</td>
+ <td>Definizione iniziale</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilità_con_i_browser">Compatibilità con i browser</h2>
+
+<div>
+<div class="hidden">La tabella di compatibilità in questa pagina è generata da dati strutturati. Se desideri contribuire ai dati, fai riferimento a <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e inviaci una PR.</div>
+
+<p>{{Compat("svg.elements.animate")}}</p>
+</div>