The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Script Problem

View previous topic View next topic Go down

Script Problem

Post by Dark_Jak_999 on September 4th 2011, 2:58 am

Good evening.
I was doing an HTML page that takes some Java Script code. Jquery to be more precise.

It turns out that when I put the code in a html page in my forum the code does not work correctly. I'm not sure how to enable the jQuery code inside the forumotion forums. Does anyone can help me with that?

Here is the complete code:
Code:
   <head>
      <title>Formulario de pedidos</title>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
      <link rel="stylesheet" href="css/style.css" type="text/css" media="screen">

<!--[if IE]><link rel="shortcut icon" type="image/x-icon" href="http://sd-1.archive-host.com/membres/up/86473130127969805/0rmtzsc4shu990207sa7.ico" /><![endif]-->
      
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

      <script src="http://evo-design.webs.com/cufon-yui.js" type="text/javascript"></script>
      <script src="http://evo-design.webs.com/BabelSans%20500.font.js" type="text/javascript"></script>
      <script src="http://evo-design.webs.com/jquery.easing.1.3.js" type="text/javascript"></script>
      <script type="text/javascript">
         $(function() {
            Cufon.replace('a, span').CSS.ready(function() {
               var $menu       = $("#slidingMenu");
               
               /**
               * the first item in the menu,
               * which is selected by default
               */
               var $selected   = $menu.find('li:first');
               
               /**
               * this is the absolute element,
               * that is going to move across the menu items
               * it has the width of the selected item
               * and the top is the distance from the item to the top
               */
               var $moving      = $('<li />',{
                  className   : 'move',
                  top         : $selected[0].offsetTop + 'px',
                  width      : $selected[0].offsetWidth + 'px'
               });
               
               /**
               * each sliding div (descriptions) will have the same top
               * as the corresponding item in the menu
               */
               $('#slidingMenuDesc > div').each(function(i){
                  var $this = $(this);
                  $this.css('top',$menu.find('li:nth-child('+parseInt(i+2)+')')[0].offsetTop + 'px');
               });
               
               /**
               * append the absolute div to the menu;
               * when we mouse out from the menu
               * the absolute div moves to the top (like innitially);
               * when hovering the items of the menu, we move it to its position
               */
               $menu.bind('mouseleave',function(){
                     moveTo($selected,400);
                    })
                   .append($moving)
                   .find('li')
                   .not('.move')
                   .bind('mouseenter',function(){
                     var $this = $(this);
                     var offsetLeft = $this.offset().left - 20;
                     //slide in the description
                     $('#slidingMenuDesc > div:nth-child('+ parseInt($this.index()) +')').stop(true).animate({'width':offsetLeft+'px'},400, 'easeOutExpo');
                     //move the absolute div to this item
                     moveTo($this,400);
                    })
                    .bind('mouseleave',function(){
                     var $this = $(this);
                     var offsetLeft = $this.offset().left - 20;
                     //slide out the description
                     $('#slidingMenuDesc > div:nth-child('+ parseInt($this.index()) +')').stop(true).animate({'width':'0px'},400, 'easeOutExpo');
                    });;
               
               /**
               * moves the absolute div,
               * with a certain speed,
               * to the position of $elem
               */
               function moveTo($elem,speed){
                  $moving.stop(true).animate({
                     top      : $elem[0].offsetTop + 'px',
                     width   : $elem[0].offsetWidth + 'px'
                  }, speed, 'easeOutExpo');
               }
            }) ;
         });
      </script>
</head>

   <body>
      
      <div id="slidingMenuDesc" class="slidingMenuDesc">
           <div><span>Custo minimo do pedido: 25 evo points</span></div>
         <div><span>Custo minimo do pedido: 200 evo points</span></div>
            <div><span>Custo minimo do pedido: 50 evo points</span></div>
            <div><span>Custo minimo do pedido: 25 evo points</span></div>
            <div><span>Custo minimo do pedido: 100 evo points</span></div>

          <div><span>Custo em depende do pedido...</span></div>
      </div>
   
      <ul id="slidingMenu" class="slidingMenu">
           <li></li>
         <li><a href="#">Avas & Sigs</a></li>
         <li><a href="#">Forum completo</a></li>
         <li><a href="#">Banners e Logos</a></li>

         <li><a href="#">Butoes e ranks</a></li>
         <li><a href="#">Flash</a></li>
         <li><a href="#">Outros</a></li>
      </ul>
      
<br>
<br>

<p class="note">Carregue no tipo de pedido que pretende<br>

  <br>
  <br>
  <br>
Nota : Os pedidos de Flash estão temporariamente encerrados. Pedimos desculpa pelo incomodo.
</p>

      

Thank you for your attention

Dark_Jak_999
New Member

Posts : 16
Reputation : 0
Language : Portuguese

Back to top Go down

Re: Script Problem

Post by Dark_Jak_999 on September 4th 2011, 10:58 pm

Can somebody please help me : (

Dark_Jak_999
New Member

Posts : 16
Reputation : 0
Language : Portuguese

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum