Jump to content

Mediabox Pentru Filmulete Sau Fisiere Flash (.swf)


gaby

Recommended Posts

Va dau direct exemplul si apoi explicatia ca sa intelegeti totul mai bine.

[Click pe poza pentru a vedea efectul]

Acum sa va explic cum puteti face asa ceva, daca v-a placut :)

Primul Pas:

Creati o pagina web in care v-eti executa trei script-uri si css-ul:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>PC Troubleshooting MediaBox</title>
<link rel="stylesheet" href="mediabox.css" type="text/css" media="screen" />
<script src="mootools.js" type="text/javascript"></script>
<script src="swfobject.js" type="text/javascript"></script>
<script src="mediabox.js" type="text/javascript"></script>
</head>[/code] [u][b]Script-urile precum si css-ul le puteti downloada de mai jos:[/b][/u] [color=orange][b]Pasul doi:[/b][/color] Salvati si urcati pozele de mai jos pe host: loading.gifprev.pngnext.pngclose.png [color=green][b]Pasul trei:[/b][/color] Dupa ce ati executat scripturile de mai sus adaugati filmuletul flash in felul urmator:
[code]<body>
<center><a title="caption text" rel="mediabox[600 450]" href="http://www.youtube.com/watch?v=kRJ2YvRv3N4"><img src="poza_exemplu.png" alt="Poza" width="300" height="180" /></a></center>
</body>
Cam asta este tot, as vrea sa precizez ca acelasi lucru puteti face si la imagini putand astfel crea o galerie de imagini, aveti un exemplu mai jos: [Click pe poza pentru a vedea efectul] Exemplu MediaBox pentru Imagini Pentru imagini va trebui sa executati doar 2 script-uri si un css anume (nu uitati sa downloadati imaginile de mai sus):
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>PC Troubleshooting Images MediaBox</title>
<link rel="stylesheet" href="moviebox.css" type="text/css" media="screen" />
<script src="mootools.js" type="text/javascript"></script>
<script src="slimbox.js" type="text/javascript"></script>
</head>[/code] [u][b]Cele 2 script-uri precum si css-ul le puteti downloada de mai jos:[/b][/u] Dupa executare script-urilor veti adauga imaginile/pozele in urmatorul fel:
[code]<body>
<center><p><a href="poza1.jpg" rel="lightbox[205]"><img src="poza1.jpg" width="100" height="100" alt="" ></a>

<a href="poza2.jpg" rel="lightbox[205]"><img src="poza2.jpg" width="100" height="100" alt="" /></a>
</p>
</center>
</body>

Cam asa se face si pentru imagini, daca aveti intrebari sau nelamuriri postati aici.

:pct:

Te-ai inregistrat? Ne-ar placea sa te prezinti.

Cum pot sustine forumul?
Cumpara de la eMag folosind acest link.
--------------------
oG2BN9d.gifse1WdXd.gifQG6MtmI.gifRHYjDzD.gifG5p1wui.gif

Link to comment
Share on other sites

  • 6 months later...

prima greseala, am facut-o eu, si anume am uitat sa pun imaginile ce trebuie sa le downloadezi (am corectat, vezi primul post), salveaza si tu imaginile.

pe pagina ta (portofoliu.html) apar urmatoarele etichete:

<html>
<head>[/code] Schimba-le cu:
[code]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
Ca imaginea mare sa se suprapuna peste text trebuie sa modifici in css-ul tau, deoarece intra in conflict cu cel al mediaboxului. Asta este codul tau css:
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
left:149px;
top:395px;
width:704px;
height:351px;
z-index:1;
}
.style1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #999999;
}
-->
</style>[/code]

Iar conflictul vine de la [b]position:absolute;[/b]

Ori incerci sa schimbi pozitionarea, ori asezi acea (acele) poze in pagina astfel incat sa nu deranjeze acel scris.

[b]Un sfat: [/b]banuiesc ca tema nu este creata de tine, sfatul meu ar fi sa o schimbi, aceasta aratand cam urat, la partea de cod.

[color=red][b]P.S:[/b][/color] vezi ca la tine pe pagina apare de doua ori, eticheta [b]<title></title>[/b] cat si [b]<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">[/b]

Te-ai inregistrat? Ne-ar placea sa te prezinti.

Cum pot sustine forumul?
Cumpara de la eMag folosind acest link.
--------------------
oG2BN9d.gifse1WdXd.gifQG6MtmI.gifRHYjDzD.gifG5p1wui.gif

Link to comment
Share on other sites

noi stim totul, doar suntem de la FBI. :P

nu, defapt, am intrat pe pagina ta, am dat click dreapta apoi view source, si am urmarit ce ai tu pe acolo.

ma bucur ca ai reusit sa rezolvi prolema :)

Te-ai inregistrat? Ne-ar placea sa te prezinti.

Cum pot sustine forumul?
Cumpara de la eMag folosind acest link.
--------------------
oG2BN9d.gifse1WdXd.gifQG6MtmI.gifRHYjDzD.gifG5p1wui.gif

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.