Xoops Italia :: Articolo
Articolo XML
http://www.xoopsitalia.org/modules/article/view.article.php/42/c8
2008-07-06T07:21:07+02:00
Xoops Italia :: Articolo
http://www.xoopsitalia.org/modules/article/
http://www.xoopsitalia.org/modules/article/images/logo.png
-
text/html
2007-01-14T10:55:19+02:00
http://www.xoopsitalia.org/modules/article/
slyss
Visualizzare un messaggio di loading nel tuo sito Xoops!
http://www.xoopsitalia.org/modules/article/view.article.php/42/c8
Categoria: Temi e templates<br />Sottotitolo: Loading Page: come fare...<br />Parole chiave: loading page, loading, caricamento pagine, scritta al caricamento<br />Sommario: Come poter fare per visualizzare un messaggio di loading, o una gif animata, al caricamento delle pagine del tuo sito Xoops.Ciao a tutti
<br /><br />
scrivo questo tutorial per insegnarvi come poter inserire un messaggio di loading, o una bella gif animata, al momento di caricamento delle vostre pagine Xoops.
<br /><br />
Tipo:
<br /><br />
<img src="http://www.charitablegift.org/demo_files/images/loading.gif"><br /><br />
<img src="http://webservice.zoosnet.net/LR/imgs/loading.gif"><br /><br />
<img src="http://ajaxload.info/images/indicator.gif"><br /><br />
<img src="http://www.spaniards.es/misc/loading.gif"><br /><br />
<br /><br />
Quando la pagina sta caricando apparirà il messaggio e sparirà appena la pagina sarà stata caricata integralmente...
<br /><br />
INIZIAMO!!!
<br /><br />
Aprite il vostro theme.html e <u>subito dopo</u> il tag <strong>< body ></strong> inserite:
<br /><br />
<div class="xoopsCode"><code><code><span style="color: #000000">
<span style="color: #0000BB"><br /></span><span style="color: #007700"><!-- </span><span style="color: #0000BB">Load indicatior </span><span style="color: #007700">-->
<br /><</span><span style="color: #0000BB">div id</span><span style="color: #007700">=</span><span style="color: #DD0000">"waitDiv" </span><span style="color: #0000BB">style</span><span style="color: #007700">=</span><span style="color: #DD0000">"position:absolute; right:0%; top:50%;
<br />visibility:hidden; text-align:center;"</span><span style="color: #007700">>
<br /><{include </span><span style="color: #0000BB">file</span><span style="color: #007700">=</span><span style="color: #DD0000">"vostro_tema_in_uso/theme_loading.html"</span><span style="color: #007700">}>
<br /> <</span><span style="color: #0000BB">script type</span><span style="color: #007700">=</span><span style="color: #DD0000">'text/javascript'</span><span style="color: #007700">>
<br /> </span><span style="color: #0000BB">toggle_visibility</span><span style="color: #007700">(</span><span style="color: #DD0000">'waitDiv'</span><span style="color: #007700">, </span><span style="color: #0000BB">1</span><span style="color: #007700">);
<br /> </span><span style="color: #0000BB"></script>
<br /></span></div>
<br /><!-- End Load Indicator --></span>
</code></code></div>
<br /><br />
ora scendete e <u>subito prima</u> del tag <strong>< /body ></strong> inserite:
<br /><br />
<div class="xoopsCode"><code><code><span style="color: #000000">
<span style="color: #0000BB"><br /></span><span style="color: #007700"><!-- </span><span style="color: #0000BB">Page Loaded Indicator Stop </span><span style="color: #007700">-->
<br /><</span><span style="color: #0000BB">script type</span><span style="color: #007700">=</span><span style="color: #DD0000">'text/javascript'</span><span style="color: #007700">>
<br /> </span><span style="color: #0000BB">toggle_visibility</span><span style="color: #007700">(</span><span style="color: #DD0000">'waitDiv'</span><span style="color: #007700">, </span><span style="color: #0000BB">0</span><span style="color: #007700">);
<br /> </span><span style="color: #0000BB"></script>
<br /></span><!-- End --></span>
</code></code></div>
<br /><br />
chiudete e salvate!
<br /><br />
Ora createvi un nuovo file chiamato <i>theme_loading.html</i> ed inseritelo nella cartella del vostro tema e inseriteci questo codice:
<br /><br />
<div class="xoopsCode"><code><code><span style="color: #000000">
<span style="color: #0000BB"><br /></span><span style="color: #007700"><</span><span style="color: #0000BB">table border</span><span style="color: #007700">=</span><span style="color: #DD0000">"0" </span><span style="color: #0000BB">align</span><span style="color: #007700">=</span><span style="color: #DD0000">"center" </span><span style="color: #0000BB">cellpadding</span><span style="color: #007700">=</span><span style="color: #DD0000">"0" </span><span style="color: #0000BB">cellspacing</span><span style="color: #007700">=</span><span style="color: #DD0000">"0"</span><span style="color: #007700">>
<br /> <</span><span style="color: #0000BB">tr</span><span style="color: #007700">>
<br /> <</span><span style="color: #0000BB">td align</span><span style="color: #007700">=</span><span style="color: #DD0000">"right"</span><span style="color: #007700">><</span><span style="color: #0000BB">img src</span><span style="color: #007700">=</span><span style="color: #DD0000">"<strong><span style="</span><span style="color: #0000BB">color</span><span style="color: #007700">: </span><span style="color: #FF8000">#FF0000;"><{$xoops_imageurl}>images/animata.gif" /></span></strong></td>
<br /> </span><span style="color: #007700"><</span><span style="color: #0000BB">td align</span><span style="color: #007700">=</span><span style="color: #DD0000">"left"</span><span style="color: #007700">><</span><span style="color: #0000BB">b</span><span style="color: #007700">><</span><span style="color: #0000BB">font color</span><span style="color: #007700">=</span><span style="color: #DD0000">"#9900CC" </span><span style="color: #0000BB">face</span><span style="color: #007700">=</span><span style="color: #DD0000">"Verdana" </span><span style="color: #0000BB">size</span><span style="color: #007700">=</span><span style="color: #DD0000">"6"</span><span style="color: #007700">><</span><span style="color: #0000BB">span style</span><span style="color: #007700">=</span><span style="color: #DD0000">"background-color: #000000"</span><span style="color: #007700">>...</span><span style="color: #0000BB">Loading page</span><span style="color: #007700">...</</span><span style="color: #0000BB">span</span><span style="color: #007700">></</span><span style="color: #0000BB">b</span><span style="color: #007700">></</span><span style="color: #0000BB">font</span><span style="color: #007700">><</span><span style="color: #0000BB">br </span><span style="color: #007700">/>
<br /> <</span><span style="color: #0000BB">br </span><span style="color: #007700">/>
<br /> <</span><span style="color: #0000BB">big</span><span style="color: #007700">><</span><span style="color: #0000BB">b</span><span style="color: #007700">><</span><span style="color: #0000BB">font color</span><span style="color: #007700">=</span><span style="color: #DD0000">"#9900CC" </span><span style="color: #0000BB">face</span><span style="color: #007700">=</span><span style="color: #DD0000">"Verdana" </span><span style="color: #0000BB">size</span><span style="color: #007700">=</span><span style="color: #DD0000">"5"</span><span style="color: #007700">><</span><span style="color: #0000BB">span style</span><span style="color: #007700">=</span><span style="color: #DD0000">"background-color: #000000"</span><span style="color: #007700">>...</span><span style="color: #0000BB">Please Wait</span><span style="color: #007700">...</</span><span style="color: #0000BB">b</span><span style="color: #007700">></</span><span style="color: #0000BB">span</span><span style="color: #007700">></</span><span style="color: #0000BB">big</span><span style="color: #007700">></</span><span style="color: #0000BB">font</span><span style="color: #007700">></</span><span style="color: #0000BB">td</span><span style="color: #007700">>
<br /> </</span><span style="color: #0000BB">tr</span><span style="color: #007700">>
<br /></</span><span style="color: #0000BB">table</span><span style="color: #007700">></span><span style="color: #0000BB"></span>
</span>
</code></code></div>
<br /><br />
<strong><span style="color: #FF0000;">modificate a dovere l'url delle vostra gif animata preferita...</span></strong>
<br /><br />
Ora createvi la vostra gif personalizzata e divertitevi!!!
<br /><br />
ciao sly <img src="http://www.xoopsitalia.org/uploads/smil44ec20d9b908d.gif" alt="" /><br />