Очень интересный эффект

[lysy]

Здравствуйте, гуру. Возможно я не там тему открыла, заранее прошу извинить.

Я увидела вот на этом форуме такой эффект http://www.forum.teensclub.ru/ там ползает паучок под форумом, может кто знает как можно такое сделать, буду очень благодарна.

[gsf]

Что-то у меня ничего не ползает. Там в поддоне баннер висит, может это от баннерообменной сети был какой-то баннер с паучком.

 

А вот например гифка с паучком:

 

клик

[lysy]

Нет это не то. Я не правильно оьъяснила. Паук ползает в самом верху форума и заползает под форум и его всё равно видно.

Вот скриншот:

http://radikal.ru/F/s59.radikal.ru/i164/09...eaefd7.jpg.html

и

http://radikal.ru/F/s51.radikal.ru/i134/09...4639ed.jpg.html

[Ritsuka]

Данный объект генерируется кодом:

<script type="text/javascript">document.write(unescape('%3c%64%69%76%20%69%64%3d%22%66%6c%61%73%68%6f%62%22%3e%0d%0a%20%20%20%20%20%20%20%20%3c%6f%62%6a%65%63%74%20%63%6c%61%73%73%69%64%3d%22%63%6c%73%69%64%3a%44%32%37%43%44%42%36%45%2d%41%45%36%44%2d%31%31%63%66%2d%39%36%42%38%2d%34%34%34%35%35%33%35%34%30%30%30%30%22%20%77%69%64%74%68%3d%22%39%30%30%22%20%68%65%69%67%68%74%3d%22%31%31%30%30%22%3e%0d%0a%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3c%70%61%72%61%6d%20%6e%61%6d%65%3d%22%6d%6f%76%69%65%22%20%76%61%6c%75%65%3d%22%68%74%74%70%3a%2f%2f%77%77%77%2e%66%6f%72%75%6d%2e%74%65%65%6e%73%63%6c%75%62%2e%72%75%2f%73%70%69%64%65%72%2e%73%77%66%22%20%2f%3e%0d%0a%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3c%70%61%72%61%6d%20%6e%61%6d%65%3d%22%77%6d%6f%64%65%22%20%76%61%6c%75%65%3d%22%6f%70%61%71%75%65%22%20%2f%3e%0d%0a%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3c%70%61%72%61%6d%20%6e%61%6d%65%3d%22%77%6d%6f%64%65%22%20%76%61%6c%75%65%3d%22%74%72%61%6e%73%70%61%72%65%6e%74%22%3e%20%0d%0a%0d%0a%20%20%20%20%20%20%20%20%3c%21%2d%2d%5b%69%66%20%21%49%45%5d%3e%2d%2d%3e%0d%0a%20%20%20%20%20%20%20%20%3c%6f%62%6a%65%63%74%20%74%79%70%65%3d%22%61%70%70%6c%69%63%61%74%69%6f%6e%2f%78%2d%73%68%6f%63%6b%77%61%76%65%2d%66%6c%61%73%68%22%20%64%61%74%61%3d%22%68%74%74%70%3a%2f%2f%77%77%77%2e%66%6f%72%75%6d%2e%74%65%65%6e%73%63%6c%75%62%2e%72%75%2f%73%70%69%64%65%72%2e%73%77%66%22%20%77%69%64%74%68%3d%22%39%30%30%22%20%68%65%69%67%68%74%3d%22%31%31%30%30%22%3e%0d%0a%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3c%70%61%72%61%6d%20%6e%61%6d%65%3d%22%77%6d%6f%64%65%22%20%76%61%6c%75%65%3d%22%6f%70%61%71%75%65%22%20%2f%3e%0d%0a%20%20%20%20%20%20%20%20%3c%21%2d%2d%3c%21%5b%65%6e%64%69%66%5d%2d%2d%3e%0d%0a%20%20%20%20%20%20%20%20%3c%70%3e%41%6c%74%65%72%6e%61%74%69%76%65%20%63%6f%6e%74%65%6e%74%3c%2f%70%3e%0d%0a%20%20%20%20%20%20%20%20%3c%21%2d%2d%5b%69%66%20%21%49%45%5d%3e%2d%2d%3e%0d%0a%20%20%20%20%20%20%20%20%3c%2f%6f%62%6a%65%63%74%3e%0d%0a%20%20%20%20%20%20%20%20%3c%21%2d%2d%3c%21%5b%65%6e%64%69%66%5d%2d%2d%3e%0d%0a%3c%2f%64%69%76%3e'));</script>

 

Автор явно очень не хотел, чтобы его идею копировали, так что лучше спросите разрешения у него, прежде чем тащить это к себе. Если же вы получили разрешение, то вот вам расшифрованное содержимое строки:

 

1. В конец форума, до "</body>"

<div id="flashob">
	<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="900" height="1100">
			<param name="movie" value="http://www.forum.teensclub.ru/spider.swf" />
			<param name="wmode" value="opaque" />
			<param name="wmode" value="transparent"> 
	<!--[if !IE]>-->
	<object type="application/x-shockwave-flash" data="http://www.forum.teensclub.ru/spider.swf" width="900" height="1100">
			<param name="wmode" value="opaque" />
	<!--<![endif]-->
	<p>Alternative content</p>
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</div>

 

2. Также вам нужен файл http://www.forum.teensclub.ru/spider.swf, который вы положите на свой сервер, и свой путь к нему укажете вместо приведенного коде выше.

 

3. В общую css форума нужно добавить:

#flashob {
margin:0 auto;
height:1%;
}

 

4. Радоваться.

Изменено 10 Июня 2009 пользователем Ritsuka

[lysy]

Ritsuka, Спасибки огромное, вот классно.

[WildRAID]

Что-то не то... Всё равно создаётся отдельная область 1000 на 900, в которой ползает паучок.

Поверх форумов ползать не хочет.. что-то ещё забыли по вёрстке.

[FatCat]

Во враппере сразу после <body> добавить:

<div style="width:100%;position:absolute;">

 

Перед </body> добавить:

</div>
<div style="margin:0 auto;height:1%;">
	<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%">
			<param name="movie" value="http://www.forum.teensclub.ru/spider.swf" />
			<param name="wmode" value="opaque" />
			<param name="wmode" value="transparent"> 
			<object type="application/x-shockwave-flash" data="http://www.forum.teensclub.ru/spider.swf" width="100%" height="100%">
			<param name="wmode" value="opaque" />
	</object>
</div>

Изменено 10 Июня 2009 пользователем FatCat

[lysy]

Что то не получается, у меня просто большой белый квадрат. Ещё копирайт вставили, наверное тему видели((

[FatCat]

Что то не получается, у меня просто большой белый квадрат. Ещё копирайт вставили, наверное тему видели((

Действующая моделька для изучения: http://slil.ru/27747881

[sambul]

да не плохо всё получилось ! Но то что предложил FatCat оч ужасно извини моё имхо чисто

[Roman Borisovich]

А другое животное можно нарисовать?

[WildRAID]

Легко. Учим flash, учим Photoshop, Corel Draw - рисуем.

 

Profit. ^__^

[Roman Borisovich]

up

[Ritsuka]

Roman Borisovich, вы реально ждете что все бросятся рисовать другое животное?)))

[Roman Borisovich]

Вопрос стоит еще в том что когда устанавливаешь данный скрипт , то почему то он оказывается еще внизу форума . Как править и где это делать не подскажите?

[Ritsuka]

Попробуйте что-то вроде этого:

#flashob { position: absolute; top: 0px; right: 0px; left: 0px; z-index: 200; }
#ipbwrapper { z-index: 1; }

[FatCat]

Ritsuka

Если я правильно понимаю, в Вашем случае линки на странице станут некликабельными.

[Ritsuka]

Хммм... Ну, тогда:

#flashob { position: absolute; top: 0px; right: 0px; left: 0px; z-index: 1; }
#ipbwrapper { z-index: 200; }

 

=)

[FatCat]

Если я правильно понял идею верстки, вся страница как раз берется в position:absolute - и она оказывается "вырванной" из потока и поднятой в более высокий слой. А флешь с пауком выводится как бы на пустую страницу, лежащую в более низком слое.

[Ritsuka]

Ну значит:

 

#flashob { /* ничего не надо */ }
#ipbwrapper { position: absolute; top: 0px; right: 0px; left: 0px; }

 

=)