JQuery :: Opening Tab Using Image Link For Navigation

Jan 11, 2010

Anyways, I use the Jquery UI Tabs plugin for navigation within a page on my website. I have two tabs on this page and I would like to have one image at the bottom of the first tab content that just simply opens the second tabbed content. I read this wiki on the documentation section of the plugin page:
..select a tab from a text link instead of clicking a tab itself var $tabs = $('#example').tabs();
// first tab selected $('#my-text-link').click(function() {
// bind click event to link $tabs.tabs('select', 2);
// switch to third tab return false; });

This is the code that I have for the image (it also uses a simple javascript image hover effect on it as well)
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('consultation','','../weddings/pagegraphics/consult_b.png',1)"><span><img src="../weddings/pagegraphics/consult_a.gif" alt="set up a consultation now" name="consultation" width="293" height="36" border="0" id="consultation" align="right" /></span></a>

So when I read the the above wiki, i assumed that you put it in head like this:
$(function(){
/* $('#tab-me').tabs(); */
$('#tabmain').tabs(4, { fxFade: true, fxAutoHeight: true});
$('.scroll-paneMap').jScrollPane();
var $tabs = $('#tab1').tabs(); // first tab selected
$('#consultation').click(function() { // bind click event to link
$tabs.tabs('select', 2); // switch to third tab
return false;
});

Where I used the id of the image as the first "blind click event to link" and the name of the first tab that is opened when you view the page as "tab1" and the name/id of the tab that I would like to open on click is tab2. This is my basic code setup:
<div id="tab1" class="tabContent">
<div class="scroll-paneContact">
MAIN CONTENT GOES HERE
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('consultation','','../weddings/pagegraphics/consult_b.png',1)"><span><img src="../weddings/pagegraphics/consult_a.gif" alt="set up a consultation now" name="consultation" width="293" height="36" border="0" id="consultation" align="right" /></span></a>
</div><div>
<div id="tab2" class="tabContent">
<div class="scroll-paneContact" >
FORM TO LINK TO FROM TAB1 GOES HERE
</div></div>

View 10 Replies


ADVERTISEMENT

JQuery :: Facebox - Opening Large Image Selecting Thumbnail Link

Mar 9, 2011

I am trying to use facebox on my site where when a thumbnail of a image is loaded, the large image appears on top. Currently when I select the thumbnail link it goes to new page with large image. I have done the following but still doesn't seem to be working.

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link href="facebox.css" media="screen" rel="stylesheet" type="text/css" />
<link href="css/example.css" media="screen" rel="stylesheet" type="text/css" />
<script src="[URL]" type="text/javascript"></script>
<script src="facebox.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('a[rel*=facebox]').facebox({
loadingImage : 'images/loading.gif',
closeImage : 'images/closelabel.png'
})})
</script> </head>

I have downloaded css and jquery files and places in relevant folder, also given images.
<a href="<?=WEB_PATH?>/images/large/<?=$Row['file_name']?>" rel="facebox">
This is where my large image files are saved.

View 1 Replies View Related

HTML File Not Opening From Image Link

Apr 14, 2009

I have a JS which I have already started to try to customise, but I am having some difficulty with it in that when I click on an image, it does not take me to my html page.with care.html. Although all files are in the same folder, I get an error indicating that the fille cannot be found (I have checked the file name spelling). I am not doing any of this online as the Web pages, when working, will be put on CDs.

View 7 Replies View Related

JQuery :: Make A Navigation Menu That When A Link Is Clicked?

Mar 9, 2011

I am trying to make a navigation menu that when a link is clicked, loads content into a hidden div, then shows the hidden div, then changed the class of the list item. If the same link is clicked again the class reverts back to what it was before and then the content div becomes hidden.

[Code]...

View 3 Replies View Related

JQuery :: Keyboard Navigation - Active Link Goes To First Element Of Unordered List

Aug 11, 2011

I am trying to develop a jquery based keyboard navigation for my new project.....

My code:

But the problem i face is that when my active link goes to first element of unordered list and then i press up arrow key, then i lose track of my active link...

View 3 Replies View Related

Opening A Link In The Same Browser?

Jan 17, 2010

ok so here what i want to do:

i want a dropdown menu

i want a button (go)

i want ten different items in the dropdown menu

if i choose the first item and click go i want a new page to open in the same window

if i choose the second item and click go i want to a different page to open in the same window and so on

all ten items lead to a different link when i click go....how do i do this?

View 3 Replies View Related

One Link Opening Two Pages

Sep 27, 2003

I want one link to open two pages inside two imageframes (just to make it easier).

View 4 Replies View Related

Opening A Link In New Window?

Nov 11, 2003

I have a button called LOOKUP, which when clicked calls a client side function that increments the nLookUp by 1 and then should open the target URL in new window. How can i accomplist this from cllient side scripting?

<script language="javascript">
<!--
var nLookUp = 0

[code].....

View 5 Replies View Related

JQuery :: Image Replace Opening In New Window

Aug 15, 2009

I'm having trouble doing an image replace. When you click on the thumbnail link to replace the large image, it opens in a new window instead of replacing the current image.

View 1 Replies View Related

JQuery :: Image Swapping For Navigation

Jan 23, 2011

I have a simple navigation bar using an ul with images.

I have the following script that swaps out the images on mouseover and mouseout to create "hover" effect.

The issue is when I try to set the src attribute of the image that has been clicked the image does not change. The first part of the click event is working and resets the src of all the images as expected, but the second part that sets the src for the image clicked does not either run or runs before the reset.

View 3 Replies View Related

Opening Link In Parent Window

Jul 20, 2005

From my web page I open another link in another browser window. That
new window is composed of two frames. I have a <a
href="....."> link on the second frame of that window. What I want is
that when user clicks on the link in the new window's second frame,
the response should open in the original browser window that opened
this secondary window(which is made of two frames). How can I do it?I
hope i have explained my problem.

I tried to used window.opened.location.href but it didnt work because
I have frames in my secondary window...

View 3 Replies View Related

Opening A Link Every Randomly X Seconds?

Dec 30, 2009

I am trying to make a script that would open a link every xx randomly seconds.

So far I have come up with this after searching:

<script>
function reloadMe() {
window.location.reload();
}

[Code].....

This works on refreashing a page every xx seconds between 30 and 60 seconds. But it does not open a link.

Is it possible to make a script that opens a link every xx seconds at random. It would be even greater if it can exclude certian times of the day, or can that be done with a cron job?

View 3 Replies View Related

Opening Link In Parent Window From Pop Up

Sep 24, 2001

I need to have a link open in the parent window after opeining one on my site.
What the user does, is he/she clicks a link in their browser. that intern opens another window with a input field and a submit button. after they hit submit, i want the next page to load in the window they first clicked the link for the pop up.
how would i do this?

View 22 Replies View Related

JQuery :: Navigation Menu - Image Fly Over Top On Hover

Jan 14, 2012

I have a navigation menu. Right now, when you hover over a menu item an image flies over the top of it. This image is set in my CSS as "nav li em". However, that image flies in to the same spot for every menu item. This is what I would like: When you hover over Item 2, em2 is invoked for the FlyIn. When you hover over Item 3, em3 is invoked.

Here is my code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL]">
<html xmlns="[URL]" xml:lang="en" lang="en">
<head>
<title>help</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#nav a").append("<em></em>");
$("#nav a").hover(function () {
$(this).find("em").animate({ opacity: "show", top: "-34"}, "fast");
var hoverText = $(this).attr("title");
$(this).find("em").text(hoverText); .....

View 4 Replies View Related

JQuery :: Image Cross-fade Using Navigation?

Apr 1, 2010

I'm working on a simple mouseover function to swap div/image fade IN and OUT and I'm getting this white flicker in between. It seems like the fadeIn waits for the fadeOut to start, hence the flicker. I've searched and found solutions, but can't implement them correctly as I am more of a beginner with JS and jQuery.

[Code]...

View 2 Replies View Related

JQuery :: Navigation Menu To Show An Image?

Nov 29, 2011

I'm trying to include a navigation menu where the viewer hovers over the link such as Main or Home and somewhere else in the page it display an image.

Similar to this : [URL]

But instead of pixels, I would just like images to be displayed.

View 2 Replies View Related

Opening IFrame Link Loading Into Parent

Jul 22, 2011

I am having difficulty in opening a link in an Iframe. If I explain, I have four pages
-Page 1 containing the Iframe
-Page 2 containing a series of thumbnails that opens in Iframe on page 1
-Page 3 is the larger image that opens in the Iframe on page 1 after clicking the thumbnail on page 2
-Page 4 is a page with a linking menu that has a link to page 3

The task I am struggling with is to get the link on page 4 to open the larger image of page 3 in the Iframe on page 1. Now I maybe doing something wrong but the code is opening page 2 in the Iframe on page 1. Below are the links to the pages in question.
Page 1 Art for Sale - Bertram Enterprises
Page 2 Bertram Enterprises Collection_Ver2
Page 3 [URL]
Page 4 Jenni Dutton - Bertram Enterprises link near bottom of page - Art for Sale
I wish to use this on many more of the images.

View 7 Replies View Related

JQuery :: Image Slider - Thumbnails Navigation Gallery

Sep 10, 2011

I came across this awesome image slider: Thumbnails Navigation Gallery with jQuery. The problem is ..you have to click on "best shots" to see the thumbnail navigation...
1) How do you show this thumbnail navigation straight away on loading the page? (ie "best shots" and other list items dont need to be there)
2) and get the thumbnails show near the bottom of the page?
3) and also get the next image to fade in automatically say after 5 seconds, without having to click on a thumbnail, although one can?

View 5 Replies View Related

JQuery :: Simple Image Rollover Action For Navigation Buttons

Aug 20, 2011

I am having a bit of trouble attempting to get this button roll over stuff working. I have looked up some really simple code to create a image rollover action for my navigation buttons. But nothing happens when I hover on any of the buttons though. When I use firebug to figure out what is wrong, it says that $(this) is the document and not the image button. The example/preview is here: [URL].

This is the jQuery code here for quick reference:
<script type="text/javascript">
$(document).ready(function(){
$('#navigation img').hover(
function() {
$(this).src = $(this).src.replace("Red","Yellow");
}, function() {
$(this).src = $(this).src.replace("Yellow","Red");
}); });
</script>

View 3 Replies View Related

JQuery :: 'this' And 'each' Or Whatever Else Might Work - Carousel Based Horizontal Image Thumbnail Navigation

Aug 9, 2009

I'm building a gallery page, that's setup like this:

- carousel based horizontal image thumbnail navigation.
- main div that loads, on thumbnail click, a high res version of each thumbnail image that exists within the carousel nav.

[Code]..

View 2 Replies View Related

JQuery :: Class Toggle Navigation - Implement A Minimal Navigation Bar

Nov 2, 2009

I'm trying to implement a minimal navigation bar using jQuery's toggleClass() function but can't seem to get it working.

It's the .img_selector div at the bottom of the page:[url]

I want to toggle the 'active' class for each <a> when it's selected, to indicate which image is showing, so after calling jQuery, in the <head> I've got:

Then the links, which also include the showPic function:

View 4 Replies View Related

JQuery :: Create An Own Horizontal Navigation And So The Navigation Is A Nested?

Feb 6, 2011

I want to create an own horizontal navigation and so the navigation is a nested list like

<ul id="mymenu">
<li>entry1
<ul class="abc">

[code]....

View 3 Replies View Related

Effect For Image Opening?

Sep 30, 2009

I saw a image opening effect that I like so much.And I would like to ask if anyone knows how can I do this.The page I have seen the effect is

View 2 Replies View Related

Navigation Button/image

Jan 8, 2006

I am trying to align the image with each button. When you move your mouse to the button...the image should display. Right now the image is display at the bottom...I would like to have the image display to the right of each button or below of each button. Code:

View 2 Replies View Related

Unable To See The Image In Navigation Bar?

Jan 23, 2011

am working on a project called online store using java. For the navigation menu bar i used javascript in a jsp page. The problem is am unable to see the image in navigation bar. Since i have no thorough knowledge of javascript please rectify me.Here is my code

[Code]...

View 3 Replies View Related

Image Map Navigation And Pulldown Menus

Aug 18, 2005

I have an image that uses an image map for navigation. We would like a pull-down menu to appear when the user mouses over the link. The pull-down menu is another image that was created to retain the look of the site and would use another image map for it's links....

View 5 Replies View Related







Copyrights 2005-15 www.BigResource.com, All rights reserved