Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [JS][CSS] MooFX oraz float:left
pzduniak
post
Post #1





Grupa: Zarejestrowani
Postów: 16
Pomógł: 1
Dołączył: 18.05.2008

Ostrzeżenie: (0%)
-----

Czy może mi kto powiedzieć, co w tym kodzie jest takiego, że przesuwa #main w prawo, po najechaniu myszką? MooTools jest z SVN'a.

index.html
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2. 	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  5. <head>
  6. 	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  7.  
  8. 	<title>PenguinZoft</title>
  9. 		<link rel="stylesheet" type="text/css" media="screen" href="style.css" />
  10. 		<script type="text/javascript" src="mootools.svn.js"></script>
  11. 		<script type="text/javascript">
  12. 		window.addEvent('domready', function(){
  13. 			var list = $$('#idList li');
  14. 			list.each(function(element) {
  15. 								var fx = new Fx.Styles(element, {duration:200, wait:false});
  16. 								element.addEvent('mouseenter', function(){
  17. 					fx.start({
  18. 						'margin-left': 5,
  19. 						'background-color': '#666',
  20. 						color: '#ff8'
  21. 					});
  22. 				});
  23. 								element.addEvent('mouseleave', function(){
  24. 					fx.start({
  25. 						'margin-left': 0,
  26. 						'background-color': '#333',
  27. 						'color': '#888'
  28. 					});
  29. 				});
  30. 							});
  31. 		}); 
  32. 	</script>
  33. 	</head>
  34.  
  35. <body>
  36. <ul id="idList">
  37. 	<li>Strona główna</li>
  38. 	<li>Projekty</li>
  39. 	<li>O nas</li>
  40. 	<li>Członkowie</li>
  41. 	<li>XModules</li>
  42. 	<li>MyID</li>
  43. 	<li>MyWorkgroup</li>
  44. 	<li>Support</li>
  45. 	<li>Forum</li>
  46. 	<li>Kontakt</li>
  47. </ul>
  48. <div id="main">
  49. Test
  50. </div>
  51. </body>
  52. </html>
[HTML] pobierz, plaintext


style.css
Kod
#idList {
    margin: 0;
    padding: 0;
    float: left;
}

#idList li {
    display: block;
    margin: 0;
    padding: 4px;
    width: 120px;
    background: #333;
    color: #888;
}
body {
    font-family: Tahoma;
    color: #fff;
    background: #222;
}
#main {
padding-left: 6px;
float: right;
text-align: left;
}


Co z tym zrobić?
Go to the top of the page
+Quote Post
« Następny starszy · Po stronie przeglądarki · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 23.08.2025 - 16:25
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn