SWFObject 2.0

Τι είναι το SWFObject;
Στατική ή Δυναμική δημοσίευση;
Στατική μέθοδος

Διαμορφωση του περιεχομένου
του Flash
Εναλλακτικό κείμενο
H βιβλιοθήκη του SWFObject
swfobject.registerObject()

Δυναμικη μέθοδος

swfobject.embedSWF
Διαμόρφωση του περιεχομένου
του Flash
Flashvars Object Params
χαρακτηριστικα

Σημαντικές Πληροφορίες
Παράδειγμα

mpeee

Το SWFObject 2.0 κυκλοφόρησε στις 14 Μαρτίου το 2008 και περιλαμβάνει:

Μία στατική μέθοδο δημοσίευσης.
Μία δυναμική μέθοδο δημοσίευσης.
Ένα JavaScript API το οποίο επιτρέπει την επαναχρησιμοποίηση των συναρτήσεων του SWFObject. Προσφέρει ένα ολοκληρωμένο εργαλείο για την ενσωμάτωση SWF αρχείων και για την επανάκτηση πληροφοριών που σχετίζονται με τον Flash Player.
Ένα εργαλείο δημοσίευσης που ονομάζεται SWFObject 2 HTML and JavaScript generator (σε HTML και Adobe Air έκδοση).

Τι είναι το SWFObject;

Πρόκειται για ένα μικρό αρχείο JavaScript που χρησιμοποιείται για την ενσωμάτωση περιεχομένου Adobe Flash σε μία ιστιοσελίδα. Το script μπορεί να εντοπίσει το Flash plug-in σε όλους τους κύριους web browser (Mac και Pc). Σχεδιάστηκε για να κάνει την ενσωμάτωση των Flash ταινιών πιο εύκολη από ποτέ. Είναι φιλικό με τις μηχανές αναζήτησης και αναμένεται να είναι συμβατό για αρκετά ακόμα χρόνια.

Το SWFObject 2.0 :

Είναι ένα έργο ανοιχτού κώδικα (Open Source) από τον Geoff Stearns, Michael Williams και τον Bobby van der Sluis.
Χρησιμοποιεί μόνο ένα μικρό αρχείο JavaScript (10Kb / GZIPed: 3.9Kb).
Είναι η συνέχεια του SWFObject 1.5 και του UFO και τείνει να αντικαταστήσει ολοκληρωτικά το Adobe Flash Player Detection Kit.

Γιατί να το χρησιμοποιήσει κάποιος ;

Προσφέρει ένα βελτιστοποιημένο και ευέλικτο τρόπο ενσωμάτωσης του Flash Player.
Μία λύση για όλους. Απευθύνεται σε κατασκευαστές λογισμικού HTML, Flash ή JavaScript.
Προωθεί τη χρήση των web standards και του εναλλακτικού περιεχομένου.
Χρησιμοποιεί τις καλύτερες πρακτικές JavaScript χωρίς να είναι δυσάρεστες στον χρήστη.
Είναι εύκολο στην χρήση του.

Γιατί το SWFObject2 χρησιμοποιεί JavaScript;

Το SWFObject 2 χρησιμοποιεί JavaScript για να ξεπεράσει θέματα που δεν μπορούν να επιλυθούν μόνο με την γλώσσα σήμανσης κειμένου(markup*).

Ανιχνεύει την έκδοση του Flash Player και καθορίζει αν θα εμφανιστεί το Flash περιεχόμενο ή το εναλλακτικό κείμενο ούτως ώστε να αποφεύγονται περιπτώσεις ξεπερασμένων εκδόσεων των Flash plug-ins που δεν εμφανίζουν το περιεχόμενο σωστά.
Προσφέρει λειτουργίες για την εμφάνιση εναλλακτικού περιεχομένου μέσω της χειραγώγησης των DOM (σημείωση: εάν δεν είναι εγκαταστημένο το Flash plug-in, το στοιχείο object της HTML θα εμφανίσει αυτόματα το εναλλακτικό κείμενό).
Παρέχετε η δυνατότητα να χρησιμοποιήσετε το πρόγραμμα Adobe Express Install για να κατεβάσετε την τελευταία έκδοση του Flash Player.
Προσφέρει ένα πλήρες JavaScript API για να προβεί κάποιος σε ενέργειες σχετικά με το Flash player και το περιεχόμενο του Flash.

Είναι καλύτερο να χρησιμοποιήσει κάποιος την μέθοδο της στατικής ή την δυναμικής δημοσίευσης;

SWFObject 2,0 προσφέρει δύο διαφορετικές μεθόδους για να εισάγετε περιεχόμενο Flash:

Την στατική μέθοδο δημοσίευσης που ενσωματώνει τόσο το Flash περιεχόμενο όσο και το εναλλακτικό κείμενο με την χρήση της γλώσσας σήμανσης κειμένου (markup language) και της JavaScript για την επίλυση προβλημάτων που δεν μπορούν να λυθούν διαφορετικά.
Την δυναμική μέθοδο δημοσίευσης που βασίζεται στο εναλλακτικό περιεχόμενο και στην αντικατάστασή του με το flash περιεχόμενο, κάνοντας χρήση της JavaScript, στην περίπτωση που είναι εγκατεστημένη η ελάχιστη απαιτούμενη έκδοση του Flash Player και υποστηρίζεται η JavaScript, από την μεριά του χρήστη. ( Παρόμοια με τις προηγούμενες εκδόσεις του SWFObject και του UFO).

Τα οφέλη της στατικής μεθόδου :

Βασίζεται και προωθεί τις ισχύουσες προδιαγραφές.
Καλύτερη απόδοση ενσωμάτωσης.
Ο μηχανισμός ενσωμάτωσης περιεχομένου Flash δεν βασίζεται σε μια γλώσσα δέσμης ενεργειών (scripting), με αποτέλεσμα το περιεχόμενο του Flash να μπορεί να φτάσει σε ευρύτερο κοινό.

Eάν το Flash plug-in είναι εγκατεστημένο, αλλά έχει απενεργοποιηθεί η JavaScript ή αν το πρόγραμμα περιήγησης (browser) δεν υποστηρίζει την JavaScript, υπάρχει ακόμη η δυνατότητα να δει κάποιος το περιεχόμενο του Flash.
Το Flash, επίσης, μπορεί να τρέξει σε μια συσκευή όπως το Sony PSP, που προσφέρει πολύ κακή υποστήριξη JavaScript.
Αυτοματοποιημένα εργαλεία όπως τα προγράμματα ανάγνωσης RSS είναι σε θέση να συλλάβουν το περιεχόμενο από το αρχείο SWF.

Τα οφέλη της δυναμικής μεθόδου:

Ενσωματώνεται πολύ καλά με άλλες εφαρμογές και επιτρέπει την χρήση δυναμικών μεταβλητών (flashvars).
Αποφεύγει το πρόβλημα της ενεργοποίησης του ενεργού περιεχομένου ("Κάντε κλικ για να ενεργοποιήσετε τη χρήση αυτού του ελέγχου") στον Internet Explorer 6/7 και Opera 9 +. Αξίζει να σημειωθεί ότι η Microsoft επί του παρόντος καταργεί το περισσότερο από το ενεργό περιεχόμενο στον Internet Explorer.

Ενσωμάτωση του Flash Player με χρήση της στατικής μεθόδου δημοσίευσης του SWFObject.

Βήμα 1ο:

Ενσωματώστε το περιεχόμενο του Flash μαζί με το εναλλακτικό κείμενο χρησιμοποιώντας γλώσσα σήμανσης κειμένου (markup language).

Η ενσωμάτωση του SWFObject χρησιμοποιεί την μέθοδο εμφωλιασμένων αντικειμένων (με ξεχωριστά, υποθετικά σχόλια στην περίπτωση του Ιnternet Explorer).

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

  <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>

<title>SWFObject - step 1</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

</head>

<body>

<div>
 <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="780" height="420">

  <param name="movie" value="myContent.swf" />

  <!--[if !IE]>-->

  <object type="application/x-shockwave-flash" data="myContent.swf" width="780" height="420">

  <!--<![endif]-->

  <p>Alternative content</p>

  <!--[if !IE]>-->

  </object>

  <!--<![endif]-->

  </object>

Σημείωση: Η παραπάνω μέθοδος απαιτεί διπλή δήλωση του object (Την εξωτερική που απευθύνεται στον Internet Explorer και την εσωτερική για όλους τους άλλους browsers). Επομένως πρέπει να καθοριστούν τα χαρακτηριστικά του object και τα στοιχεία param δύο φορές.

Απαιτούμενα χαρακτηριστικά :

classid (στοιχείο αντικειμένου μόνο για το εξωτερικό object. Η τιμή είναι πάντα clsid:D27CDB6E-AE6D-11cf-96B8-444553540000).
type (μόνο για το εσωτερικό στοιχείο. Η τιμή είναι πάντα application/x-shockwave-flash).
data (μόνο για το εσωτερικό στοιχείο, καθορίζει το URL του SWF).
width (απευθύνεται και στα δύο στοιχεία, καθορίζει το πλάτος του SWF).
height (απευθύνεται και στα δύο στοιχεία, καθορίζει το ύψος του SWF).

Απαιτούμενα param στοιχεία.

movie (στοιχείο μόνο του εξωτερικού object, καθορίζει το URL του SWF).

Σημείωση: Προτρέπεται να μην γίνεται χρήση του codebase χαρακτηριστικού για επικοινωνία με τον Server της Adobe, προκειμένου να κατεβάσετε τον installer του Flash plug-in. Προτείνουμε την χρήση του εναλλακτικού κειμένου με ένα διακριτικό μήνυμα ότι ο χρήστης μπορεί να έχει μία καλύτερη εμπειρία αν κατεβάσει τον plug-in του Flash.

Σημείωση: Η ετικέτα param καθορίζει τα run-time χαρακτηριστικά του object.

Αξιοποίηση της HTML για την διαμόρφωση του περιεχόμενου του Flash;

Μπορείτε να προσθέσετε τα ακόλουθα προαιρετικά χαρακτηριστικά στο στοιχείο object.

id
name
class
align

Μπορείτε να χρησιμοποιήσετε τα επόμενα προαιρετικά param στοιχεία (πληροφορίες).

play
loop
menu
quality
scale
salign
wmode
bgcolor
base
swliveconnect
flashvars
devicefont (πληροφορίες)
allowscriptaccess ( πληροφορίες 1 , πληροφορίες 2)
seamlesstabbing (πληροφορίες)
allowfullscreen (πληροφορίες)
allownetworking (πληροφορίες)

Γιατί είναι απαραίτητη η χρήση του εναλλακτικού κειμένου;

Το στοιχείο object επιτρέπει την ύπαρξη εναλλακτικού κειμένου μέσα στα όριά του, το οποίο θα εμφανιστεί αν το Flash δεν είναι εγκατεστημένο ή δεν υποστηρίζεται. Το περιεχόμενο αυτό χρησιμοποιείται και από τις μηχανές αναζήτησης στην αναζήτηση τους. Εν τέλει, πρέπει να χρησιμοποιήσετε εναλλακτικό κείμενο όταν θέλετε να δημιουργήσετε περιεχόμενο που μπορούν να το διαβάζουν άνθρωποι που περιηγούνται στο διαδίκτυο χωρίς plug-in εγκατεστημένα, όταν θέλετε περιεχόμενο φιλικό για τις μηχανές αναζήτησης ή όταν θέλετε να ενημερώσετε τους επισκέπτες της σελίδα σας ότι κατεβάζοντας το Flash plug-in θα έχουν την δυνατότητα ποιοτικότερης περιήγησης.

Βημα 2ο :
Συμπεριλάβετε την Javascript βιβλιοθήκη του SWFObject στο head της HTML σελίδας σας.

Η βιβλιοθήκη του SWFObject αποτελείται από ένα εξωτερικό αρχείο JavaScript. To SWFObject θα εκτελεστεί μόλις διαβαστεί και θα εκτελέσει όλους τους Dom χειρισμούς μόλις το Dom θα φορτωθεί για όλους τους browsers που το υποστηρίζουν, όπως οι IE, Firefox, Safari και Οpera 9+. Διαφορετικά εκτελείτε μόλις συμβεί το onload γεγονώς.

Το HTML DOM είναι μία σταθερά για το πώς να πάρεις, αλλάξεις, προσθέσεις ή να διαγράψεις HTML στοιχεία.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML  1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

  <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

    <head>

      <title>SWFObject - step 2</title>

      <meta http-equiv="Content-Type" content="text/html;  charset=iso-8859-1" />

  

      <script type="text/javascript" src="swfobject.js"></script>

  

    </head>

    <body>

      <div>

        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="780" height="420">

          <param name="movie" value="myContent.swf" />

          <!--[if  !IE]>-->

          <object type="application/x-shockwave-flash" data="myContent.swf" width="780" height="420">

          <!--<![endif]-->

            <p>Alternative  content</p>

          <!--[if  !IE]>-->

          </object>

          <!--<![endif]-->

        </object>

      </div>

    </body>

  </html>

Βήμα 3ο :
Καταχωρήστε το περιέχομενο του Flash στην βιβλιοθήκη του SWFObject και ενημερώστε το SWFObject τι να κάνει με αυτό.

Πρώτα απ' όλα προσθέστε ένα μοναδικό id στο "εξωτερική" object ετικέτα (tag) που καθορίζει το περιεχόμενο του Flash. Στην συνέχεια προσθέστε την swfobject.registerObject() μέθοδο, η οποία περιμένει τέσσερα (4) ορίσματα.

Το πρώτο όρισμα (String (απαιτούμενο)) καθορίζει το id που χρησιμοποιείτε στo html στοιχείο μέσα στo body tag .
Το δεύτερο όρισμα (String (απαιτούμενο)) καθορίζει την έκδοση του Flash player με την οποία εκδόθηκε το περιεχόμενο μας. Ενεργοποιεί την εξερεύνηση της έκδοσης του Flash για ένα .swf και καθορίζει αν θα εμφανιστεί το Flash περιεχόμενό μας ή το εναλλακτικό κείμενο.
Το τρίτο (String (προαιρετικό)) μπορεί να χρησιμοποιηθεί για την ενεργοποίηση του Adobe Εxpress Ιnstall και καθορίζει την διεύθυνση του express install .swf αρχείου. Το Express Ιnstall εμφανίζει ένα τυποποιημένο παράθυρο διαλόγου του Flash plug-in αντί για το πραγματικό περιεχόμενο στην περίπτωση που ο χρήστης δεν έχει εγκατεστημένο το απαιτούμενο plug-in. Σημειώνεται ότι το Express Install θα ενεργοποιηθεί μόλις μία φορά ( την πρώτη φορά), ότι υποστηρίζεται από το Flash player 6.0.65 ή νεότερο σε Windows ή Mac πλατφόρμες και ότι απαιτεί ένα ελάχιστο μέγεθος του .swf αρχείου της τάξεως των 310x137px.
Το 4ο όρισμα (συνάρτηση της JavaScript (προαιρετικό)) μπορεί να χρησιμοποιηθεί για να καθοριστεί μία callback(link) συνάρτηση που καλείται στις περιπτώσεις αποτυχίας ή επιτυχίας της ενσωμάτωσης του .swf αρχείου.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML  1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

  <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

    <head>

      <title>SWFObject - step 3</title>

      <meta http-equiv="Content-Type" content="text/html;  charset=iso-8859-1" />

      <script type="text/javascript" src="swfobject.js"></script>

  

      <script type="text/javascript">

      swfobject.registerObject("myId", "9.0.115", "expressInstall.swf");

      </script>

  

    </head>

    <body>

      <div>

  

        <object id="myId" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="780" height="420">

  

          <param name="movie" value="myContent.swf" />

          <!--[if  !IE]>-->

          <object type="application/x-shockwave-flash" data="myContent.swf" width="780" height="420">

          <!--<![endif]-->

            <p>Alternative  content</p>

          <!--[if  !IE]>-->

          </object>

          <!--<![endif]-->

        </object>

      </div>

    </body>

  </html>

Ενσωμάτωση του Flash Player με χρήση της δυναμικής μεθόδου έκδοσης του SWFObject.

Βήμα 1ο:
Δημιουργήστε εναλλακτικό κείμενο χρησιμοποιώντας την HTML.

Η δυναμική μέθοδος ενσωμάτωσης του SWFObject ακολουθεί τις αρχές της προοδευτικής αναβάθμισης αντικαθιστώντας το εναλλακτικό HTML περιεχόμενο με το Flash περιεχόμενο όταν υποστηρίζεται η JavaScript και υπάρχουν τα απαραίτητα plug-in του Flash από την μεριά του χρήστη. Αρχικά ορίζουμε το εναλλακτικό κείμενο μέσα σ΄ ένα tag(ετικέτα) και το προσδιορίζουμε με ένα id.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML  1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

  <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

    <head>

      <title>SWFObject dynamic  embed - step 1</title>

      <meta http-equiv="Content-Type" content="text/html;  charset=iso-8859-1" />

    </head>

    <body>

      

      <div id="myContent">

        <p>Alternative  content</p>

      </div>

      

    </body>

  </html>

Βήμα 2:
Συμπεριλάβετε την JavaScript βιβλιοθήκη του SWFObject στο head μέρος της HTML σελίδας σας.

Η βιβλιοθήκη του SWFObject αποτελείται από ένα εξωτερικό αρχείο JavaScript. To SWFObject θα εκτελεστεί μόλις διαβαστεί και θα εκτελέσει όλους τους Dom χειρισμούς για όλους τους browsers που το υποστηρίζουν, όπως οι IE, Firefox, Safari και Οpera 9+. Αλλιώς εκτελείτε μόλις συμβεί το onload γεγονός.

<!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

  <head>

    <title>SWFObject dynamic embed - step  2</title>

    <meta http-equiv="Content-Type" content="text/html;  charset=iso-8859-1" />

  

    <script type="text/javascript" src="swfobject.js"></script>



  </head>

  <body>

    <div id="myContent">

      <p>Alternative content</p>

    </div>

  </body>

  </html>

Επεξήγηση κώδικα: Μέσα στο div id="myContent"…… «κρατάμε» την Flash ταινία μας. Το κείμενο που υπάρχει μέσα σ αυτό το HTML στοιχείο περιμένει να αντικατασταθεί από το κανονικό Flash περιεχόμενο. Επομένως οι χρήστες που έχουν εγκατεστημένο το κατάλληλο plug-in του Flash δεν θα δούνε ποτέ αυτό το κείμενο. Το χαρακτηριστικό αυτό, έχει το επιπλέον πλεονέκτημα ότι επιτρέπει στις μηχανές αναζήτησης να κατηγοριοποιούν αυτό το εναλλακτικό κείμενο.

Βήμα 3ο:
Ενσωματώστε το .swf αρχείο με την χρήση JavaScript.

swfobject.embedSWF (swfUrl, id, width, height, version, expressInstallSwfurl, flashvars, params, attributes, callbackFn) έχει πέντε απαραίτητα και πέντε προαιρετικά ορίσματα.(περισσότερα )

swfUrl (String, απαραίτητο) καθορίζει το URL και το όνομα του SWF σας.
id (String, απαραίτητο) καθορίζει το id του HTML στοιχείου σας (που περιέχει το εναλλακτικό κείμενο) .
width (String, απαραίτητο) καθορίζει το πλάτος του SWFσας.
height (String, απαραίτητο) καθορίζει το ύψος του SWF σας.
version (String, απαραίτητο) καθορίζει την απαιτούμενη έκδοση του Flash Player για το SWF σας ( π.χ. "6.0.65" ή "6" ).
expressInstallSwfurl (String, προαιρετικό) καθορίζει το URL του express install SWF και ενεργοποιεί το Adobe Express Install. Σημειώνεται ότι το Express Install θα ενεργοποιηθεί μόλις μία φορά ( την πρώτη φορά), ότι υποστηρίζεται από το Flash player 6.0.65 ή νεότερο σε Windows ή Mac πλατφόρμες και ότι απαιτεί ένα ελάχιστο μέγεθος του SWF αρχείου της τάξεως των 310x137px.
flashvars (Object, προαιρετικό) μεταβλητές που χρησιμοποιούνται για να μεταφέρουμε δεδομένα από το ΗTML στην Flash ταινία μας(πληροφορίες).
params (Object, προαιρετικό) καθορίζει τα params του εσωτερικού στοιχείου object με ζευγάρια, όνομα : τιμή.
callbackFn (JavaScript συνάρτηση, προαιρετικό) μπορεί να χρησιμοποιηθεί για τον ορισμό μίας callback συνάρτησης που καλείτε και στην αποτυχία και στην επιτυχία της διαδικασίας ενσωμάτωσης του SWF αρχείου (πληροφορίες).

Σημείωση: Μπορείτε να παραλείψετε τα προαιρετικά ορίσματα, αρκεί να μην διαταράξετε την σειρά των παραμέτρων. Αν δεν θέλετε να χρησιμοποιήσετε μια προαιρετική παράμετρο, αλλά θέλετε να χρησιμοποιήσετε την επόμενή της, απλά περνάτε false σαν τιμή αυτής της παραμέτρου. Για τα ορίσματα Flashvars, params και attributes μπορείτε να περάσετε ακόμη και ένα κενό αντικείμενο {}.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML  1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

  <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

    <head>

      <title>SWFObject dynamic  embed - step 3</title>

      <meta http-equiv="Content-Type" content="text/html;  charset=iso-8859-1" />

      <script type="text/javascript" src="swfobject.js"></script>

      

      <script type="text/javascript">

      swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0");

      </script>

  

    </head>

    <body>

      <div id="myContent">

        <p>Alternative  content</p>

      </div>

    </body>

  </html>

Διαμορφώνοντας το περιεχόμενο του Flash;

Προσθέτοντας τα παρακάτω προαιρετικά χαρακτηριστικά (link) στο στοιχείο object:

id (όταν δεν ορίζεται κληρονομεί το id από στοιχείο που αφορά το περιεχόμενο του εναλλακτικού κειμένου).
name
styleclass (χρησιμοποιείται αντί για το class).
align

Μπορείτε να προσθέσετε τα ακόλουθα προαιρετικά στοιχεία param.

play
loop
menu
quality
scale
salign
wmode
bgcolor
base
swliveconnect
flashvars
devicefont (πληροφορίες)
allowscriptaccess (πληροφοριες 1 , πληροφοριες 2 )
seamlesstabbing (πληροφορίες)
allowfullscreen (πληροφορίες)
allownetworking (πληροφορίες)

Τρόποι καθορισμού των Flashvars, params και object χαρακτηριστικών με την χρήση αντικειμένων JavaScript.

Μπορείτε να ορίσετε JavaScript αντικείμενα χρησιμοποιώντας την κατά λέξη δήλωση η οποία μοιάζει με τον παρακάτω κώδικα:

 <script type="text/javascript">

  

  var flashvars = {};

  var params = {};

  var attributes = {};

  

  swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

  

  </script>

Να προσθέσετε ζευγάρια όνομα : τιμή κατά την δήλωση ενός αντικειμένου.(Σημείωση: μην βάζετε κόμμα μετά το τελευταίο ζευγάρι μέσα στο αντικείμενο).

<script type="text/javascript">
  var flashvars = {

    name1: "hello",

    name2: "world",

    name3: "foobar"

    };

    var params = {

    menu: "false"

    };

    var attributes = {

    id: "myDynamicContent",

    name: "myDynamicContent"

    };
  swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);
</script>

Ή να προσθέσετε ιδιότητες και τιμές μετά την δημιουργία του αντικειμένου με την χρήση της τελείας (dot notation):

<script type="text/javascript">

  

  var flashvars = {};

  flashvars.name1 = "hello";

  flashvars.name2 = "world";

  flashvars.name3 = "foobar";

  

  var params = {};

  params.menu = "false";

  

  var attributes = {};

  attributes.id = "myDynamicContent";

  attributes.name = "myDynamicContent";

  

  swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

  

  </script>

Το οποίο μπορεί να γραφτεί και σαν (η πιο δυσανάγνωστη μέθοδος αλλά και η πιο σύντομη) :.

<script type="text/javascript">

  

  swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", {name1:"hello",name2:"world",name3:"foobar"}, {menu:"false"}, {id:"myDynamicContent",name:"myDynamicContent"});

  

  </script>

Αν δε θέλετε να χρησιμοποιήσετε ένα όρισμα τo ορίζετε σαν false ή σαν κενό. (μπορείτε να χρησιμοποιήσετε και null ή 0).

<script type="text/javascript">

    

    var flashvars = false;

    var params = {};

    var attributes = {

    id: "myDynamicContent",

    name: "myDynamicContent"

    };

  

    swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

  

  </script>

Η δήλωση του αντικειμένου Flashvar υπάρχει για την δικιά σας ευκολία χρήσης. Μπορείτε να την αγνοήσετε και να ορίσετε τα flashvars μέσω του αντικειμένου params.

<script type="text/javascript">

  

  var flashvars = false;

  var params = {

    menu: "false",

    flashvars: "name1=hello&name2=world&name3=foobar"

  };

  var attributes = {

    id: "myDynamicContent",

    name: "myDynamicContent"

  };

  

  swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

Σημαντικές Πληροφορίες

Χρησιμοποιήστε το SWFObject HTML and JavaScript generator για να συγγράψετε τον κώδικά σας.
Απλά επαναλάβετε τα βήματα 1 και 3 για να ενσωματώσετε επιπλέον SWF αρχεία στην HTML σελίδα σας.

*Λόγω της δυσκολίας να αποδώσω με ευκρίνεια την έννοια της λέξης markup χρησιμοποιώ αυτήν εδώ την επεξήγηση. Ο όρος markup περιλαμβάνει την HTML, την CSS και το Script. Για χάρη συντομίας στην μετάφραση θα χρησιμοποιείται η «γλώσσα σήμανσης κειμένου» αντί του παραπάνω όρου.

Στην ετικέτα object συμπεριλαμβάνονται αντικείμενα όπως εικόνες, ήχος, video, Java applets, ActiveX, PDF και Flash.

To στοιχείο object σχεδιαζόταν για να αντικαταστήσει τα στοιχεία img και applet αλλά εξαιτίας των προβλημάτων και την έλλειψης υποστήριξης από την μεριά των browsers αυτό δεν συνέβει.

Σημαντικό: Μην χρησιμοποιήσετε την ετικέτα object για εικόνες. Χρησιμοποιήστε την ετικέτα img καλύτερα.

Παράδειγμα ενσωμάτωσης Flash περιεχομένου με την δυναμική μέθοδο δημοσίευσης.

Κατεβάστε(download) την πρόσφατη έκδοση του SWFObject ( SWFObject_2_2 ). Περιλαμβάνει το απαραίτητο αρχείο JavaScript, παραδείγματα και source κώδικα. Θα χρησιμοποιήσετε τρία από τα αρχεία που περιλαμβάνει το .zip. Το swfobject.js, το test.swf και το expressInstall.swf. Σώστε αυτά τα τρία (3) αρχεία σ ένα φάκελο.
Δημιουργήστε μία HTML σελίδα με όποιον editor(κειμενογράφος) θέλετε(text ή HTML). Σώστε την σελίδα στον ίδιο φάκελο με τα παραπάνω αρχεία.
Γράψτε το εναλλακτικό κείμενο σ ένα div μέσα στο body μέρος της HTML σελίδας σας.
Εισάγετε την SWFObject JavaScript βιβλιοθήκη στο head της HTML σελίδα σας. Ενσωματώνοντας την βιβλιοθήκη στο head μέρος, εξασφαλίζουμε ότι το SWFObject φορτώνεται πριν εμφανιστεί το περιεχόμενο της σελίδας μας. Επίσης ότι μπορούμε να καλέσουμε μεθόδους του SWFObject από οπουδήποτε μέσα στον HTML κώδικά μας.
Ενσωματώστε το .swf αρχείο σας με την βοήθεια της JavaScript. Καλέστε την συνάρτηση embedSWF() που ανήκει στην βιβλιοθήκη του SWFObject και περιμένει πέντε(5) υποχρεωτικά και τέσσερα(4) προαιρετικά ορίσματα. Τοποθετούμε την συνάρτηση αυτή στο head μέρος της HTML σελίδας μας για να εξασφαλίσουμε, παρομοίως με προηγουμένως, ότι θα εκτελεστεί πριν το περιεχόμενο της σελίδας να είναι ολοκληρωτικά ορατό στον χρήστη.
Δοκιμαστική προβολή της HTML σελίδας. Προβάλετε το αρχείο σας στον αγαπημένο σας περιηγητή(browser). Θα δείτε το SWF αρχείο σας σε περίπτωση που έχετε εγκατεστημένο το κατάλληλο Flash Player.

Επιπλέον :

Code Generator. Είναι διαθέσιμο ένα αρχείο για να κάνει γρηγορότερη και ευκολότερη την διαδικασία παραγωγής κώδικα για ένα developer. Υπάρχουν δύο διαθέσιμες εκδόσεις για κατέβασμα – HTML και Adobe Air - . Απλά συμπληρώνετε την τοποθεσία του .swf και του SWFObject.js , το πεδία width και height και την μέθοδο δημοσίευσή που θέλετε να χρησιμοποιήσετε. Ο generator θα γράψει όλο το απαιτούμενο κώδικα για να ενσωματώσετε και να δείτε τον κώδικα σας. Με ένα απλό copy paste σε μια HTML σελίδα είστε έτοιμοι.

Ενδιαφέροντα Links

Tutorials

Σχόλια