www.webdeveloper.com
Results 1 to 2 of 2

Thread: #Linking in classes

  1. #1
    Join Date
    Dec 2011
    Location
    California
    Posts
    11

    #Linking in classes

    I am in a little bit of a dilemma. My issue is that I am trying to make one of my tabs link to an outbound website URL using an href. However I am working with HTML that uses Javascript to show only certain div fields based upon what tab you click on.

    My question is: I need to be able to make the tab-portfolio class link to an outbound website without showing all division fields. I have tried changing my href, but when I do, it messes up the javascript and shows all of my division fields in the code which isn't correct.

    The HTML code is as follows:

    Code:
    <!-- Menu -->
                    <div class="menu">
                    	<ul class="tabs">
                        	<li><a href="#profile" class="tab-profile">Profile</a></li>
                        	<li><a href="#resume" class="tab-resume">Resume</a></li>
                        	<li><a href="#portfolio" class="tab-portfolio">Portfolio</a></li>
                        	<li><a href="#contact" class="tab-contact">Contact</a></li>
                        </ul>
                    </div>
                    <!-- /Menu -->
    The Javascript is as follows:
    Code:
    /* ---------------------------------------------------------------------- */
    	/*	Menu
    	/* ---------------------------------------------------------------------- */
    	
    	// Needed variables
    	var $content 		= $("#content");
    	
    	// Run easytabs
      	$content.easytabs({
    	  animate			: true,
    	  updateHash		: false,
    	  transitionIn		:'slideDown',
    	  transitionOut		:'slideUp',
    	  animationSpeed	:600,
    	  tabs				:"> .menu > ul > li",
    	  tabActiveClass	:'active',
    	});
    	
    	// Hover menu effect
    	$content.find('.tabs li a').hover(
    		function() {
    			$(this).stop().animate({ marginTop: "-7px" }, 200);
    		},function(){
    			$(this).stop().animate({ marginTop: "0px" }, 300);
    		}
    	);

  2. #2
    Join Date
    Nov 2006
    Location
    Oakland
    Posts
    500
    How about just write a jquery event handler for the portfolio link.

    $("#content .tabs li .tab-portfolio").click(function(){
    document.href="URL of external website";
    });

    Of course you can also opt to open the external web site in a new window.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles