Rolovacie menu

Programovacie jazyky, rady, poradňa...
kamo_444
Star
Star
Príspevky: 695
Registrovaný: 05 sep 2010, 16:43

Re: PHP Scripty

Príspevok od používateľa kamo_444 »

Potreboval by som script aký ma http://www.gamespot.com/

a potom aj to rolovacie menu čo má.
TommyHot
Addict
Addict
Používateľov profilový obrázok
Príspevky: 3340
Registrovaný: 25 okt 2009, 0:23
Bydlisko: Bratislava
Kontaktovať používateľa:

Re: PHP Scripty

Príspevok od používateľa TommyHot »

To rolovacie menu s PHP nema nic spolocne a aky script z toho webu chces?
Blade.m
Medium Star
Medium Star
Príspevky: 454
Registrovaný: 06 apr 2007, 20:10
Bydlisko: Čadca

Re: Rolovacie menu

Príspevok od používateľa Blade.m »

oni to maju riesene cez javascript...skus tu popozerat, urcite najdes uz nejaky hotovy script: https://www.google.sk/#hl=sk&sclient=ps ... 66&bih=643
kamo_444
Star
Star
Príspevky: 695
Registrovaný: 05 sep 2010, 16:43

Re: PHP Scripty

Príspevok od používateľa kamo_444 »

tak potom to okno alebo neviem ako sa to volá
kde sú tie novinky
a po určitom čase sa to prepne
a je možno pod tým to manuálne prepnúť na určitú tému
TommyHot
Addict
Addict
Používateľov profilový obrázok
Príspevky: 3340
Registrovaný: 25 okt 2009, 0:23
Bydlisko: Bratislava
Kontaktovať používateľa:

Re: PHP Scripty

Príspevok od používateľa TommyHot »

To tiez nema s PHP nic spolocne.

Je to robene javacsriptom. Mozno ti bude vyhovovat niektory z tychto pluginov http://designmodo.com/jquery-slider-scripts-tutorials/
kamo_444
Star
Star
Príspevky: 695
Registrovaný: 05 sep 2010, 16:43

Re: PHP Scripty

Príspevok od používateľa kamo_444 »

ok poskúšam tie veci

ďakujem za radu
kamo_444
Star
Star
Príspevky: 695
Registrovaný: 05 sep 2010, 16:43

Roll menu

Príspevok od používateľa kamo_444 »

Netuším ako to mám transformovať :(

Toto je kód čo som našiel na jedno roll menu:

Kód: Vybrať všetko

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>CSSnewbie Example: CSS-Only Dropdown Menu</title>
<style>
/* These styles just pretty up the page a bit. */
body {
   font: 62.5%/1.2 Arial, Helvetica, sans-serif;
   background-color: #eee; }
#wrap {
   font-size: 1.3em;
   width: 400px;
   padding: 20px;
   margin: 0 auto; 
   background-color: #fff;
   position: relative; }

/* These styles create the dropdown menus. */
#navbar {
   margin: 0;
   padding: 0;
   height: 1em; }
#navbar li {
   list-style: none;
   float: left; }
#navbar li a {
   display: block;
   padding: 3px 8px;
   background-color: #5e8ce9;
   color: #fff;
   text-decoration: none; }
#navbar li ul {
   display: none; 
   width: 10em; /* Width to help Opera out */
   background-color: #69f;}
#navbar li:hover ul, #navbar li.hover ul {
   display: block;
   position: absolute;
   margin: 0;
   padding: 0; }
#navbar li:hover li, #navbar li.hover li {
   float: none; }
#navbar li:hover li a, #navbar li.hover li a {
   background-color: #69f;
   border-bottom: 1px solid #fff;
   color: #000; }
#navbar li li a:hover {
   background-color: #8db3ff; }
</style>

<script>
// Javascript originally by Patrick Griffiths and Dan Webb.
// http://htmldog.com/articles/suckerfish/dropdowns/
sfHover = function() {
   var sfEls = document.getElementById("navbar").getElementsByTagName("li");
   for (var i=0; i<sfEls.length; i++) {
      sfEls[i].onmouseover=function() {
         this.className+=" hover";
      }
      sfEls[i].onmouseout=function() {
         this.className=this.className.replace(new RegExp(" hover\\b"), "");
      }
   }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
</script>

</head>
<body>
   <div id="wrap">
      <h1>CSS-Only Dropdown Menu</h1>
      <ul id="navbar">
      <!-- The strange spacing herein prevents an IE6 whitespace bug. -->
         <li><a href="#">Item One</a><ul>
            <li><a href="#">Subitem One</a></li><li>
            <a href="#">Second Subitem</a></li><li>
            <a href="#">Numero Tres</a></li></ul>
         </li>
         <li><a href="#">Second Item</a>
            <ul>
               <li><a href="#">Just one subitem</a></li></ul>
         </li>
         <li><a href="#">No Subitem</a></li>
         <li><a href="#">Number Four</a>
            <ul>
               <li><a href="#">Subitem One</a></li><li>
               <a href="#">Second Subitem</a></li><li>
               <a href="#">Numero Tres</a></li><li>
               <a href="#">Fourth Thinger</a></li></ul>         
         </li>
      </ul>
      <p><a href="/easy-css-dropdown-menus/">Go back to the main article.</a> This CSS-only dropdown menu should work in all modern browsers. It has been tested and found working in Firefox 2, IE 7, Safari 3, and Opera 8.5. With the included JavaScript, the dropdowns also work in IE 6 (the all-important non-modern browser).</p>
      <p>Donec vel massa. Ut nibh. Donec placerat ultrices dui. Morbi eu dui eget mauris cursus pellentesque. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras ante neque, tempor eu, semper sit amet, hendrerit vitae, quam. Nullam ante. Pellentesque arcu sapien, suscipit in, elementum vitae, vulputate quis, metus. Quisque sollicitudin leo a diam. Quisque in risus sit amet mi faucibus feugiat. Ut ullamcorper pede a libero. Donec nisl.</p>
   </div>

</body>
</html>
a toto je môj kód kde mám butony (css súbor):

Kód: Vybrať všetko

#pc a {
	display: block;
	width: 46px;
	height: 36px;
	padding: 0;
	background-image: url(tlacidla/PC.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	text-decoration: none;
	position: absolute;
	left: 550px;
	top: 67px;
}
#pc a:hover{
	background-position: -46px 0;
}

#pc a:active{
	background-position: -92px 0;
}

#xbox a {
	display: block;
	width: 86px;
	height: 36px;
	padding: 0;
	background-image: url(tlacidla/Xbox.jpg);
	background-repeat: no-repeat;
	background-position: 0 0;
	text-decoration: none;
	position: absolute;
	left: 596px;
	top: 67px;
	
}
#xbox a:hover{
	background-position: -86px 0;
}

#xbox a:active{
	background-position: -172px 0;
}

#ps3 a {
	display: block;
	width: 46px;
	height: 36px;
	padding: 0;
	background-image:url(tlacidla/ps3.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	text-decoration: none;
	position: absolute;
	left: 682px;
	top: 67px;
}
#ps3 a:hover{
	background-position: -46px 0;
}

#ps3 a:active{
	background-position: -92px 0;
}
#vita a {
	display: block;
	width: 49px;
	height: 36px;
	padding: 0;
	background-image:url(tlacidla/vita.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	text-decoration: none;
	position: absolute;
	left: 728px;
	top: 67px;
}
#vita a:hover{
	background-position: -49px 0;
}

#vita a:active{
	background-position: -98px 0;
}

#wii a {
	display: block;
	width: 40px;
	height: 36px;
	padding: 0;
	background-image:url(tlacidla/wii.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	text-decoration: none;
	position: absolute;
	left: 777px;
	top: 67px;
}
#wii a:hover{
	background-position: -40px 0;
}

#wii a:active{
	background-position: -80px 0;
}
#ds a {
	display: block;
	width: 46px;
	height: 36px;
	padding: 0;
	background-image:url(tlacidla/3ds.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	text-decoration: none;
	position: absolute;
	left: 817px;
	top: 67px;
}
#ds a:hover{
	background-position: -46px 0;
}

#ds a:active{
	background-position: -92px 0;
}

#mobil a {
	display: block;
	width: 76px;
	height: 36px;
	padding: 0;
	background-image:url(tlacidla/mobil.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	text-decoration: none;
	position: absolute;
	left: 863px;
	top: 67px;
}
#mobil a:hover{
	background-position: -76px 0;
}

#mobil a:active{
	background-position: -152px 0;
}
A neviem prísť na to ako to spraviť tak aby to bolo na tie butony čo mám ja

Vopred ďakujem za každú pomoc :wink:
Napísať odpoveď