Solved Posts by AleMonteiro Page 6

AleMonteiro 238 Can I pick my title?

12 Years Ago

Ok, since you are using connected lists, listen to the receive event and when it occurs, validate if there's another item in the target. If there is, you can either remove the old one or the new one.

http://api.jqueryui.com/sortable/#event-receive

Web Development javascript php

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: move input lil up

I think i made it:

<html>
    <style>
#top_menu_wrapper
{
    border: 2px solid green;
    width:600px;
    height:100%;
    float:right;
    text-align:left;
    padding:50px;
}

#top_menu_wrapper ul
{
    list-style-type: none; /*remove bullets*/
    text-align: right;
}

#top_menu_wrapper li 
{ 
    display: -moz-inline-stack;
    display: inline-block;
    zoom: 1; /* for IE */
    *display: inline;  /* for IE 6 e 7 */
}

#top_menu_wrapper li a 
{   
    padding: 0 15px; 
} 

#search_bar input[type="text"] {
    background: url(../IMAGE/search-white.png)no-repeat 10px 5px #444;
    border: 0 none;
    font: bold 12px Arial,Helvetica,Sans-serif;
    color: #d7d7d7;
    width:150px;
    padding: 6px 15px 6px 35px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3); 
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
    -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
    -webkit-transition: all 0.7s ease 0s;
    -moz-transition: all 0.7s ease 0s;
    -o-transition: all 0.7s ease 0s;
    transition: all 0.7s ease 0s;

    }

#search_bar input[type="text"]:focus {
    background: url(../IMAGE/search-dark.png) no-repeat 10px 5px #fcfcfc;
    color: #6a6f75;
    width: 200px;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
    -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
    text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    }
    </style>

    <body>
        <div id = 'header_wrapper'>
            <div id = 'logo_wrapper'>
                <h1><a href='index.php'>ECOMMERCE SITE</a></h1> …

UI / UX Design web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: issue with external validation javascript

You post your code and what it should do, but you didn't say what the problem is.

What dificulties are you having?

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Drag and Drop help needed!

The link is broken, can't see anything.

In any case, take a look at jQUery UI Drag & Drop: http://jqueryui.com/droppable/

Web Development javascript php

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: move input lil up

Try this way:

<div id = 'top_menu_wrapper'>
    <form  id='search_bar' action='Config_FullStoreURLSearchResults.asp' method='get' name='SearchBoxForm'>
        <ul>
            <li><a href='#'>Log In</a></li>
            <li><a href='#'>Register</a></li>
            <li><a href='#'>About Us</a></li>
            <li><input type='text' name='Search' id='search_input' value='Search...'/></li>        
        </ul>
    </form>
</div>

UI / UX Design web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: pop up window in css?

Hi.

yes, it's possible to do it with JQuery. In fact, jQuery it's the easiest way to do it.

You'll need the html strucutre for the window, the css to add style to the window and jQuery to open, close and manage the window.

Google a little bit about JQuery PopUp Window that you'll find a lot of things.

If you don't want to code much I suggest that you use jQuery UI Dialog.
http://jqueryui.com/dialog/

UI / UX Design html-css web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: i need help in mouseup upload a file

Did you test if the mouseUp Listener is being triggered?

Just to make sure, mouseUp is triggered when then user click and let go. Is that what you want?

Another thing, Hover expects two functions. Because Hover is a bind for mouseOver and mouseLeave.

And, if you want mouseUp, you don't need mouseOver.

So, either remove the Hover or change it to MouseOver. I suggest you remove it.

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: dropdown menu hide show text box

You are welcome.

Mark the tread as solved please.

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: dropdown menu hide show text box

This should do the trick:

var lastSelection = undefined;

function handleSelection(choice) {
    document.getElementById('select').disabled=false;
    document.getElementById(choice).style.display="block";

    if ( lastSelection != undefined ) {
        document.getElementById(lastSelection).style.display="none";
    }

    lastSelection = choice;
}

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Gender validation not working right

Your problem is that your radio buttons have different names. A group of radio buttons are defined by the radios name.

Check this example:

<html>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

    <script>
        $(function(){
            $("#btnCheck").click(function(){
                alert("Selected Value: " + $("input[name=sex]:checked").val());
            });
        });
    </script>

    <body>
        <input type="radio" name="sex" value="M" /> Male
        <input type="radio" name="sex" value="F" /> Female
        <button type="button" id="btnCheck">Check It</button>
    </body>
</html>

Another thing, posting the full source is not a good idea. Not because you may not like it, but because the number of people with patience and good will to read all of it is very low. I mean, the bigger the code you post, fewer people will read.

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Gender validation not working right

Are you using checkbox? With checkbox the user will be able to selected more than one sex.
Isn't radio button that you need?

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Gender validation not working right

A doubt, the input sex is of what kind? A checkbox, radio button?

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Gender validation not working right

Try $('.sex').is(':checked')

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: hiding and showing navigation

You're welcome, and right.Even if doens't affect nothing at the current implementation, it will still be processed without changes to the UI.

If solved, please mark as such.

Seeya.

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: hiding and showing navigation

You are welcome. But two concerns about your code:

1."#navBox ul li.mainList" will accept click in any content of 'mainList'. This means that when you click a item in the 'subList' the listener will be triggered too.
2."#navBox ul li.mainList" it's not a recommended selector. It works, but is not fast. Because jQuery will search all levels of itens to find it. In your case it's a lot better to use just 'li.mainList' or at least '#navBox > ul > li.mainList'.

Another thing, $(function(){}); it's an abreviation of $(document).ready(function(){});

With that in mind, I'd suggest:

$(function(){
    $("li.mainList > a").click(function(){           

        $("ul.subList").removeClass("visible");
        $(this).parent().find("ul").addClass("visible");

    });
});

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: hiding and showing navigation

Hi, first thing, your script is loaded and executed at load time. This mean that when the script is run the DOM is not ready, so none of the objects that you are trying to add an handler to will exist. This means that the listeners are not attached.
To solve this, call your scripts at the load of the page. One way of doing it is:

//jQuery on DOM loaded event
$(function() {
    $(".mainList a").click(function(){
        $(this).find("ul").toggle();
    });
});

Another thing, the selector '.mainList a' will select all 'a' inside '.mainList'. This mean that all 'a', even in the sub-menus will be selected.

To select only the 'a' in the main list do as '.mainList > a' (will select only the 'a' that is directly bellow '.mainList').

Another thing, "$(this).find('ul')" will find nothing. Because $(this) is an '<a>' and there's nothing inside it to be found. An solution it's to use 'next' instead of 'find' (find only search inside the selected element, while 'next' search in the same level as the element)

Here's one example that should work fine:

//jQuery on DOM loaded event
$(function() {
    $(".mainList > a").click(function(){ // Attach click to <a> directly bellow .mainList
        $(this).next("ul").toggle();
    });
});

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Iframe Display HTML

You could use something like this:

var frame = document.getElementById("myIFrame"); // iFrame with the HTML
var div = document.getElementById("myDiv"); // div to show the HTML

div.innerText = frame.document.body.innerHTML; // Sets the Text of the div as the HTML of the frame.

Using innerText will not parse the HTML.

Web Development html-css javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: get text between html tags using javascript code

Just by curiosity, I made a version extending the Table Cell prototype:

HTMLTableCellElement.prototype.getText = function() {
    return typeof this.textContent === 'string' ? this.textContent : this.innerText;
};

var cell = document.getElementById('home');

alert(cell.getText());

Web Development html-css javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: get text between html tags using javascript code

Using JQuery:

var text = $("#home").text();

Using pure JavaScript:

var cell = document.getElementById('home');
var text = typeof cell.textContent === 'string' ? cell.textContent : cell.innerText;

Web Development html-css javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: CSS - div height = auto + 10%??

Try using padding on the outter box.

UI / UX Design html-css web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: How do you make a block button on a answer website? read more

First of all, what do you mean by BLOCK BUTTON?

Web Development

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: JavaScript Not working in IE but perfect in FF, GC,Safari

What do you mean by:
p.name = "p";
?

I think he is sending the password as 'p' (name of the input), and the password input goes blank.

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: how to automatically insert foreign key value in this scenario ?

Triggers can be dangerous, if you use it wrong, but for somethings is the best option.

And please, post your new question in a new post and mark this as solved.

Databases client-server sql

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: how to automatically insert foreign key value in this scenario ?

Sure, there's a lot of them, a couple are:

You can do it all in asp.net.
You can work only with triggers (ie.: a update trigger on Users that will check if the user has a application, and if it doesn't it'll create one).
You can do the initial insert in asp.net and the new ones at the trigger.

Databases client-server sql

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: JavaScript Not working in IE but perfect in FF, GC,Safari

What error do you get? In IE, open developers tools (F12), go to the Script tab and start debugging.

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: how to automatically insert foreign key value in this scenario ?

So, I suggest you to make an store procedure to create the records for the existings users and then create a insert trigger at the users table for the new users.

Databases client-server sql

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: how to automatically insert foreign key value in this scenario ?

For each user on tblUser you want to create an record on tblApplicantScrutiny, is that it?

Databases client-server sql

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: How can a person make a application out of a website? read more

If you post the website that you are trying to replicate I can tell you a good language to do it.

Software Development

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: How can a person make a application out of a website? read more

No, if you want to create a desktop app you need to master just one of them(C#, JAVA, ROR or Delphi).

But be aware, none of the code of the website would be reutilized. So you better study the effects that you want to use to see what language and framework would do it more easily.

Software Development

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: How can a person make a application out of a website? read more

Ok, i got it now.

The easist way is to transform the saved page you have into a new website. You don't have to host it, as far as the website contain only HTML, CSS, JS and VBS you can run it directly in the browser.

To ajust the websit interface you would need knowlodge in:

HTML
JavaScript ou VBScript
CSS

But you could also create a new app, and in this case you would need to choose a language to program and a framework to build the app on. At the top of my mind I can name you:

C# .Net
JAVA
Ruby On Rails
Delphi

Software Development

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: CSS Float Behaviour

You are welcome, but mark the post as solved.

UI / UX Design html-css web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: How can a person make a application out of a website? read more

Do you have any experience with software developement and/or programming languages?

Software Development

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: CSS Float Behaviour

I can't explain the theory to you, but I can say somethings from practice.

When you use float on a element, you need to use clear in the next so it doesn't mess up:

#left { background: #AAAAFF; margin-right: 10px; float: left; }
#right { background: #FFAAAA; clear: left; }

Or, if you want both to be on the same line you need to use float on both(and clear on the next element that will be on another line):

#left { background: #AAAAFF; margin-right: 10px; float: left; }
#right { background: #FFAAAA; float: left; }
#bottom { clear: left; }

I don't like to use float, it always give me headaches. So, I use this class instead(works for all modern browsers - IE7+) :

    .inline
    {
        position: relative;
        display: -moz-inline-stack;
        display: inline-block;
        zoom: 1;
        vertical-align: top;

        *display: inline;
    }

And the HTML would be:

    <div class="columns inline" id="left">left</div>
    <div class="columns inline" id="right">right</div>

Hope it helps.

UI / UX Design html-css web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: jQuery getting text dynamic

It would be something like this:

$(function(){ // OnLoad
    $("#MyInputID").keyup(function(){ // Key Up Event
        var val = $(this).val(); // Get value from input
        $("#MyParagraphID").html(val); // Set p html
    });
});

Web Development javascript javascript-jquery

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Linking HTML table to Excel cells

Please, if you got your anwser mark as solved.

Thanks.

UI / UX Design html-css microsoft-office web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Linking HTML table to Excel cells

When you say link the HTML cell with the excel cell, it's sounds to me that each change at the HTML will reflect in the excel, and vice-versa.

But what I understood is that you just want to show your excel as an HTML table. Am I right?

UI / UX Design html-css microsoft-office web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Menus

Try this:

a, a:link, a:hover, a:active, a:visited {
    color: #fff;
}

UI / UX Design web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Menus

You gave no info that can be analysed. Please post the code with problem, and if possible a test page or upload to jsfiddle.net.

UI / UX Design web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Form Validation Not working

That's right, but I didn't even try to correct the code because was simpler to just remake it, a little more sophisticated.

I can't stand a lot more of code than it's actually needed.

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Form Validation Not working

But did it solve your problem?

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Need help with 2 JQuery functions

Try this to block space:

$("#nickname").keypress(function(evt){
            if ( evt.keyCode == 32 ) // space
            {
                return false;
            }
        });

Here's my whole test:

<head>
        <script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script>
        <script type="text/javascript">

            $(function(){

                $("#nickname").keypress(function(evt){
                    if ( evt.keyCode == 32 ) // space
                    {
                        return false;
                    }
                });

                $("#nickname").change(function(){
                    str = $(this).val();
                    $("#log").append("<br/>change: "+ str);
                });
            });

        </script>
    </head>

    <body>
        <input type="text" name="nickname" id="nickname" />
        <div id="log"></div>
    </body>

Web Development javascript javascript-jquery

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: SQL Select Between Two Dates

What do you mean by wrong filtering? It's returning something it shouldn't or not returning something that it should?

Anyway, I would try DateTimePicker.Value.ToString("yyyy-MM-dd")

Software Development vb.net

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Costs of Web Designing

In Brazil, the development of a restaurant software could cost from $5k to $30k (R$10k to R$ 60k).

But it depends on the functionalities. IE.: if it will register clients, products, staff, internet sales, delivery, if it will use printers, displays, scales, cards and so on.

Depending on how far the system goes, it can be pretty expensive.

And this is only considering one plataform(desktop or web), but in restaurants it's nice to have an mobile app for the waiters to make the orders.

What I want to say is that it's hard to ask for a budget without the list of functionalities, without a pre-defined scope.

UI / UX Design web-design

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Relative Positioning a Title with CSS

I thin your problem is with the dashes(right and left) aligned with float. I don't like to use float, instead I use this class to align inline:

.inline
{
    position: relative;
    display: -moz-inline-stack;
    display: inline-block;
    zoom: 1;
    vertical-align: top;

    *display: inline;
}

Try it and let me know.

UI / UX Design html-css web-design wordpress

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Add and remove div tag with table caption

Please post the complete code so we can run it, or, better yet, upload it to jsfiddle.

Web Development javascript

AleMonteiro 238 Can I pick my title?

12 Years Ago

Re: Form Validation Not working

Hi, I didn't look for the problem in your code, but I made an example in my way:

     <!DOCTYPE html>
    <html>
    <head>
      <meta http-equiv="content-type" content="text/html; charset=UTF-8">

     <script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script>

      <style type='text/css'>

      </style>

    <script language="javascript">

    $(document).ready(function() {
        $('#txtarea').change(function() {

            // Create options for origin
            var optionsOrigin = [
                [0, 'Select'],
                [1, 'NAIA 1'],
                [2, 'NAIA 2'],
                [3, 'NAIA 3']
            ];

            // Create options for destination
            var optionsDestination = [
                [0, 'Select'],
                [15, 'NAIA 1'],
                [16, 'NAIA 2'],
                [18, 'NAIA 3']
            ];

            // Create options for vehicle
            var optionsVehicle = [
                [0, 'Select'],
                [9, 'Toyota VIOS 1.3 MT'],
                [10, 'Toyota VIOS 1300 E AT'],
                [11, 'Toyota VIOS 1500 G AT']
            ];


            /*

            if ($(this).val() == "1") { 
                optionsOrigin = ...
                optionsDestination = ...
            }
            else if ...

            */

            // Set the options to the selects
            $("#txtorigin").setOptions(optionsOrigin);
            $("#txtdestination").setOptions(optionsDestination);
            $("#txtvehicle").setOptions(optionsVehicle);
        });
    });

    // Validate Form
    function validate()
    {
        if ($("#txtarea").selectedIndex() < 1)
        {
          alert("Please select area");
          return false;
        }  

        if ($("#txtorigin").selectedIndex() < 1)
        {
          alert("Please select origin");
          return false;
        }

        if ($("#txtdestination").selectedIndex() < 1)
        {
          alert("Please select destination");
          return false;
         }   


        if ($("#txtvehicle").selectedIndex() < 1)
          {
          alert("Please select vehicle");
          return false;
          }               
    }

    // Extends JQuery
    (function ($)
    {
        $.fn.extend({

            // Set array de options to select
            setOptions: function (options)
            {
                $(this).each(function ()
                {
                    $(this).empty();

                    if (options != undefined && options != null)
                    {
                        var tmpHtml = "";
                        for (var i = 0; i < options.length; i++)
                        {
                            var item = options[i];
                            tmpHtml += '<option value="' + item[0] + '">'+ …

Web Development javascript

AleMonteiro 238 Can I pick my title?

13 Years Ago

Re: Rollover images help

Hi nvap, please post an example with what you are trying to do.

Web Development html-css javascript javascript-jquery

AleMonteiro 238 Can I pick my title?

13 Years Ago

Re: Need Help to complete menus

I wasn't able to reproduce the problem, but see if this works:

$(document).ready(function(){	
	
	$("#navlist li").hover(		
		function() {  
			if ( $(this).hasClass("minimized") )
			{
				$(this).stop().animate({ height: "75", opacity: 1  }, 1000 );
				$(this).find('a').show('slide', 500);
			}
			else
			{
				$(this).stop().animate({ top: '15px' }, 200, 'swing'); 
			}
		}, 
		function() {  
			if ( $(this).hasClass("minimized") )
			{
				$(this).stop().animate({ height: "7", opacity: 0.4  }, 1000 ).addClass("minimized");
				$(this).find('a').hide();
			}
			else
			{
				$(this).stop().animate({ top: '0px' }, 200, 'swing');	
			}
		}					
	);
  
	$('#navlist li').click(function(){   

		$('#navcontainer').animate({opacity: 1,"marginTop": 0,duration: "slow",easing: "easein"}, 1000 );
		
		$('#navlist li').not(this).animate({ height: "7", opacity: 0.4  }, 1000 ).addClass("minimized");
		
		$(this).removeClass("minimized");
		
		$('#navlist li a').hide();
		$(this).find('a').stop().animate({ opacity: 1 });		
		$(this).find('a').show('slide',1000);
	});
	
});

Web Development javascript

AleMonteiro 238 Can I pick my title?

13 Years Ago

Re: Need Help to complete menus

Something like this?

<!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=utf-8" />
<title>Untitled Document</title>
</head>

<body>

<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.js"> </script>
<script type='text/javascript'>
$(document).ready(function(){	
	
	$("#navlist li").hover(		
		function() {  
			if ( $(this).hasClass("minimized") )
			{
				$(this).animate({ height: "75", opacity: 1  }, 1000 ).addClass("minimized");
				$(this).find('a').show('slide', 500);
			}
			else
			{
				$(this).stop().animate({ top: '15px' }, 200, 'swing'); 
			}
		}, 
		function() {  
			if ( $(this).hasClass("minimized") )
			{
				$(this).animate({ height: "7", opacity: 0.4  }, 1000 ).addClass("minimized");
				$(this).find('a').hide();
			}
			else
			{
				$(this).stop().animate({ top: '0px' }, 200, 'swing');	
			}
		}					
	);
  
	$('#navlist li').click(function(){   

		$('#navcontainer').animate({opacity: 1,"marginTop": 0,duration: "slow",easing: "easein"}, 1000 );
		
		$('#navlist li').not(this).animate({ height: "7", opacity: 0.4  }, 1000 ).addClass("minimized");
		
		$(this).removeClass("minimized");
		
		$('#navlist li a').hide();
		$(this).find('a').stop().animate({ opacity: 1 });		
		$(this).find('a').show('slide',1000);
	});
	
});
</script>

<style>

/* CSS Document */

#navcontainer{
		text-align: center;
		text-transform: uppercase;				
		float: left;
		color: #333;
		background: #f0e7d7;
		height: 25px;
		width: 100%;
		display: inline-block;				
		padding: 2em 0;				
		margin-top:250px;
		padding-bottom:55px;
		padding-top:5px;
		position:relative;				
	     }
			  
		  
#navlist {
	   display: block;
	   list-style-type: none;
	   background:none;			
	   width: 70%;	
	   height: 100%;
	   padding: 0;
	   margin: 0 auto;				
	   position:relative;			
	 }


#navlist li{
	     display: inline;				
	     width:  125px;
	     height: 75px;				
	     float: left;		
	     position:relative;
	     padding-right:1px;
             background:#99CC66;
	    }
			
			
#navlist li a {
		display: block;
		width: 100%;
		height: 100%;
		background-repeat: no-repeat;
		background:none;
		color:#000000;
				
	      }
			  
#navlist li a span {
	             display: block;
	             padding: 60px 7px 0;
	             font-size: 12px;
	             text-align: center;
	             font-weight:bold;
                   }


</style>

	<div id="navcontainer">
	   <ul id="navlist">
		<li><a href="#" class="current"><span>Home</span></a></li>
		<li><a href="#"><span>About</span></a></li>
		<li><a href="#"><span>Contact</span></a></li>
		<li><a href="#"><span>Item four</span></a></li>
		<li><a href="#"><span>Item five</span></a></li>
	   </ul>
	</div>

</body>
</html>

Web Development javascript

AleMonteiro 238 Can I pick my title?

13 Years Ago

Re: Need Help to complete menus

Ok, let's see:

1. All itens are showed at the center of the page.
2. Click on Home item.
3. The menu goes to the top of the page.
4. Home item remains the same size, and all others are minimized.

From there, what you want to do?

Web Development javascript