JQuery :: Highlight Current Link When Loading To A DIV Using LoadContent?
Oct 10, 2010
Currently using jQuery's
function loadContent(elementSelector, sourceURL) {
$(""+elementSelector+"").load(""+sourceURL+"");
}
and href="javascript:loadContent('#content', 'page/home.html');"
to load some remote content into the main container. The problems is: i'm unable to find any working solution to highlight the current, active menu item (build as an <ul> and styled with external css), considering the main page isn't reloading - especially when i'm in no way able to understand JS at all.Would any of you have any idea how to mark the current menu item marked as active untill another one is chosen - and then repeat the function?
I have an image scroller with several elements connected to it in an array. When the image goes to the next slide, the elements (title, category, desc., etc.) adjust to coincide with the new image. My issue is that I am unable to create an element (category) that pulls each "category:'current slide category'," entered in the array as a list and highlights the current slide's corresponding category.
E.g., var slides = Array( { <!--slide 1 --> url: 'images/image1.jpg', category:'category 1', title: 'This is the title of the image/article', imgLink: '#', caption: 'This briefly explains the image/article', }, { <!--slide 2 --> url: 'images/image2.jpg', category:'category 2', Title: 'this is the title of the image/article', imgLink: '#', caption: 'this briefly explains the image/article', },)
I want it to display: >> category 1 / category 2 / category 3 The corresponding slide 2 elements are active/visible in the slideshow, so whatever is entered as the category for each slide should be listed visibly (instead of the non-current items fading) and then highlighting the current one. Slideshow JS (category element on lines 309-313): [URL]
Altough I'm using jQuery for some time, this is my first post here about an issue that I really got stuck with. Otherwise jQuery is really nice and simple to use.
I have an HTML table with many rows and columns with each row containing info about one specific item and a delete link (there is a delete link for each row). What I want to do is to highlight the whole row (<tr> element) in the table (with a different background color) when I click on the delete link of that row (the new page opens in a new window.)
My question is: How do I highlight (by changing the bg color for the whole <tr> element or -if that's not possible- all of that row's <td> elements) the row if I have clicked the delete link in that row. I want the row to stay highlighted so that I would know what rows were deleted. I guess this'll require id-specific actions applied to the row <tr> or all of its cells with an onclick event in that rows delete link.
Umm, this is a tricky one to add a descriptive title for!
Basically I have two links on the page that go to the same page when clicked. What I want to do is when I hover over one of those links for the hover to work for both of them and visa versa.
I've got this script which effectively should change the clicked link's opacity to full and its siblings' opacity to 0.6. The only part that works though is the changing the text color to black. Here's the script:
As you can see this code will open up a new window. I can't seem to find the code to make it appear in the same window. As in I click on the link "ABOUT US" and the new page loads on the current window. Code: <div style = "cursor:pointer;hand" onclick = "window.open('testdocaboutus.html')" class = "txt-1">ABOUT US</div>
I'd like to be able to get Superfish to expand the entire menu and show the current active link in pathlevel 2. I'm using the nav-bar style and it seems that only pathlevel 1 is visible:
I'm trying to build a menu with an animation color and my problem is that the funtion is apply to all the links in the menu but ideally I would like to apply to all elements less the one with the id current.
at the moment I just created two functions but still apply both of them to the current link.
Here is the code:
<script type="text/javascript"> // font color animation $(".second a").hover(function() { $(this).animate({ color: "#00aadd" }, 400);
I created a bookmarklet script to help me audit extremely large style sheets.Basically while on a site that you would like to audit, you click the bookmarklet and the document's body contents gets remove and replaced with an iframe that points to the current sites home page. From here you can choose what style sheet (the script finds) to begin reporting over. The more pages you browse (through the iframe) the more accurate the report gets.My problem however, is if the person is on the site's home page when first running the script, the iframe never loads up. I think it has to do with the fact that you are on the home page, and then the iframe tries to point to the home page as well and fails for some reason.You can test it by bookmarking this bookmarklet and running it on any site's home page where style sheets can be found:
Get The Bookmarklet on this page (http://tinyurl.com/3gx7fw5)
Again, it works great if you don't start the script from a sites home page.
I'm using the jmapping plugin and it's all working great - when you click on a location link in the side bar the map pans to the location. However what I also want to happen when I click the location link is to load more information about the location onto the page.The idea is to load the div from infodivs.aspx which has an id that matches the href of the link that was clicked. I can make the whole page load without issue but I can't get my head around the syntax for identifying the href of the clicked link and then inserting that into the load statement as a div id.I've tried this.href but if that's actually the right approach, I haven't phrased it right so farHere's the code:
$("a.map-link").click(function () { $('div#moreinfo').empty().load('infodivs.aspx what goes here?'); });
If you need to load a page and then add a light box to it be sure that the whole page is loaded before you add the lightbox or it will not function.
In your description you add the lightbox and the load some content. The content are not in the dom when you add the lightbox so the lightbox don't know what to add it's function onto.
I've looked on the forums and google for this, and I can't find anything exactly right:I have a universal navigation, one link is "Print PDF" - I don't want to hand code each page individually.How can I use the current page url - such as "website.com/accomodations.php" to print a PDF named after the page, like "accomodations.pdf", or even better "pdfs/accomodations.php"?OR just any way to print a PDF associated with the current page - I guess it doesn't necessarily need to be the URL that links the files.
$(document).ready(function() { $('#main-content a').live('click', function() { alert(this); $('#main-content').load(this); return false; });}); Why is the above code segment not loading the page? When I replace this by an url it works correctly. The alert gives a correct url.
I'm not sure if this is the correct place to post this question. If it isn't, please let me know where I should post it.I created a simple content slider with each link directed to a section on the same page. The menu I'm using is straightforward:
I have huge page of links, to whcih I am currently adding. I would like to add a "random link" button which would parse the current page, extract all URLs then load a random link.
I know how to use javascript to modify a newly opened window's properties. Instead, what I want to happen is someone clicks on a link and they stay in the current browser window, but the window size changes to fit my specifications.
I'm using jQuery.LocalScroll to scroll a large page to the content depending on the link clicked. I have one css styled menu that stays in a consistent position while the rest of the page moves.It works well but as the page isn't 're-loading' for each section I can't think how I can indicate on the menu which section you are in.
Basically I want some of the links in my page to open in new tabs (I'm using Firefox) or windows if the user has their options configured that way. And I want my page to remain intact as it involves some AJAX and takes a while to load.
But ...and this seems to be a big "but"... I don't want the focus to move away from the page I'm on. So techniques such as <a target="_blank"or <a onclick="window.open(...)"aren't working for this requirement. I even tried using a separate function and attempting to return to the original window straight after using the following function: Code:
