• Site Logo, Articulate

Sfoglia gli articoli

Seleziona un prodotto

Directory di supporto di null

Esplora tutti gli articoli di null (Last Updated )

Nessun articolo trovato.

Risultati della ricerca

Nessun articolo trovato.

Storyline 360: suggerimenti ed esempi in JavaScript

Ultimo aggiornamento dell'articolo 16 gen 2026

Aggiungi interattività avanzata ai tuoi corsi Storyline 360 con trigger JavaScript che vanno oltre la quotidianità per offrire esperienze di allievo più personalizzate.

Esplora i suggerimenti

Non forniamo supporto diretto per la codifica JavaScript, ma i seguenti suggerimenti possono aiutarti a iniziare:

  • Non includerlo <script type="text/javascript"> nei trigger.
  • Tieni presente che ogni trigger JavaScript può contenere fino a 32.767 caratteri di codice.
  • Sfrutta l'evidenziazione della sintassi e i numeri di riga nelle funzionalità dell'editor JavaScript.
  • Risolvi i problemi del codice con la console integrata.
  • Se usi jQuery nei tuoi trigger JavaScript, fai riferimento alla libreria jQuery.
  • Ottieni informazioni generali sulla codifica JavaScript su w3schools.com o Codecademy.
  • Utilizza l'API JavaScript avanzata per ottenere un controllo preciso sulle proprietà degli oggetti e altro ancora.
  • Storyline 360 non ha variabili di sistema documentate che puoi usare in JavaScript. Puoi scoprirne alcuni lavorando con l'output pubblicato di Storyline 360 o cercando nei forum della community. Tuttavia, potrebbero interferire con la riproduzione del corso e potrebbero non funzionare in tutte le versioni di Storyline 360.
  • Visualizza l'anteprima dei trigger JavaScript locali nel lettore moderno, ad esempio i trigger JavaScript che recuperano o impostano il valore di una variabile Storyline 360. Se utilizzi trigger JavaScript complessi, ti consigliamo comunque di pubblicare il corso su un server Web o un LMS per testarlo correttamente.
  • Utilizzate il metodo Player.getVar per recuperare il valore delle variabili Storyline 360 e utilizzate il metodo Player.setVar per impostare il valore di una variabile Storyline 360. In altre parole, puoi estrarre informazioni dalle variabili Storyline 360 con Player.getVar e inserire informazioni nelle variabili Storyline 360 con Player.setVar.
  • Usa il trigger che chiama la funzione. Le funzioni JavaScript vengono eseguite solo all'interno del trigger da cui vengono richiamate, non su più trigger.
  • Per includere tutte le funzioni JavaScript in un file JavaScript (.js) separato, inserisci il file JavaScript personalizzato nella cartella story_content dell'output pubblicato, quindi aggiungi la seguente riga di codice al file story.html prima del tag</head> di chiusura.

    <script LANGUAGE="JavaScript1.2" SRC="/story_content/MyJavaScriptFunctions.js" TYPE="text/javascript"></script>

    Puoi richiamare le funzioni appropriate nei trigger di Storyline 360. Tieni presente che non supportiamo questo metodo.

Trova esempi

Ti chiedi cosa potresti fare con JavaScript? La nostra sfida e riepilogo di JavaScript offre dozzine di demo della nostra meravigliosa community di sviluppatori di e-learning. Continua a leggere per trovare esempi di alcuni dei più comuni trigger JavaScript e anche alcune demo!

Modificare il valore di una variabile Storyline 360
Questo esempio assegna la data corrente a una variabile Storyline 360. Dimostrazione video.

var currentTime = new Date()
var month = currentTime.getMonth() + 1
var day = currentTime.getDate()
var year = currentTime.getFullYear()
var dateString=month + "/" + day + "/" + year
var player = GetPlayer();
player.SetVar("SystemDate",dateString);

Messaggio pop-up (solo testo)

alert("Your message here...");

Messaggio pop-up (testo e valore di una variabile Storyline 360)

var player = GetPlayer();
alert("Welcome back, " + player.GetVar("FirstName") + ".");

Certificato di completamento della stampa

Dai un'occhiata a questa demo e all'esempio scaricabile di Tracy Carroll. Tracy utilizza due trigger JavaScript per ottenere la data corrente, acquisire il nome dello studente e stampare un certificato.

Avvia un nuovo messaggio e-mail

var email="yourAddress@email.com";
var subject="subject line";
var body_start="How you want to begin your body.";
var mailto_link='mailto:'+email+'?subject='+subject+'&body='+body_start;
win=window.open(mailto_link,'emailWin');

Barra di scorrimento orizzontale

Ecco una demo e un esempio scaricabile di Asbjorn Reinhold. Asbjorn imposta un trigger JavaScript per collegare una variabile slider alla posizione di un oggetto, creando l'effetto di una barra di scorrimento orizzontale.

Scorri automaticamente la pagina web fino a una posizione specifica

window.scroll(0,150); // horizontal and vertical location

Scorrimento automatico della pagina web rispetto alla posizione corrente

window.scrollBy(0,150); // horizontal and vertical scroll increments

Genera un numero casuale
Questo esempio genera un numero casuale compreso tra 1 e 10. Dimostrazioni video qui e qui.

var randomnumber = Math.floor((Math.random()*10)+1);
var player = GetPlayer();
player.SetVar("randnum",randomnumber);

Sapevi che Storyline 360 ha variabili numeriche casuali? Guarda questo video dimostrativo e queste istruzioni per saperne di più.

Rendi più accessibili le interazioni con JavaScript

Quando crei elementi interattivi che utilizzano JavaScript, non dimenticare l'accessibilità! Tieni a mente questi suggerimenti per rendere le interazioni più inclusive per tutti gli allievi:

  • Migliora con JavaScript, ma non fare affidamento su di esso. Inizia con i trigger e le funzionalità integrati in Storyline 360, progettati per l'accessibilità e gestiscono automaticamente la maggior parte delle interazioni. Usa JavaScript solo quando hai bisogno di funzionalità aggiuntive, come animazioni personalizzate o pop-up. Il corso dovrebbe funzionare anche senza JavaScript, in modo che tutti gli allievi possano partecipare.
  • Mantieni chiari gli indicatori di messa a fuoco. Aiuta gli allievi a rimanere orientati mentre navigano nel corso. Sposta l'attenzione in modo appropriato quando i contenuti cambiano, usa l'aria-hiddenattributo per gestire la visibilità delle tecnologie assistive e mantieni visibili gli indicatori di messa a fuoco (2.4.3 Focus Order e 2.4.7 Focus Visible).
  • Usa controlli standard con etichettatura chiara. Scegli pulsanti e collegamenti standard per una migliore accessibilità. Per gli elementi personalizzati, aggiungi etichette o ruoli ARIA significativi e assicurati che gli allievi possano navigarli utilizzando una tastiera (4.1.2 Nome, Ruolo, Valore e tastiera 2.1.1).
  • Rispetta le preferenze. Lascia che gli allievi mantengano il controllo. Usa le regioni live per modifiche importanti, rispetta le impostazioni di movimento e lingua ridotte, evita il movimento o l'audio automatici e consenti agli allievi di ingrandire o ridimensionare l'interfaccia (2.3.3 Animazione da interazioni, 1.4.2 Audio Control e 2.2.2 Pausa, Stop, Hide).
  • Esegui test con tecnologie assistive. Usa gli screen reader, la navigazione da tastiera e le funzioni di zoom per testare il corso. Ricontrolla che gli allievi possano seguire gli aggiornamenti e abbiano abbastanza tempo per rispondere o esplorare i contenuti (2.2.1 Tempistica regolabile).

Suggerimento: prova a raggiungere i tuoi obiettivi di interattività con l'HTML standard prima di aggiungere gli attributi ARIA.