I've got a problem. I've built a navigation page to be used in an iframe across a site. I've made menus like this in PHP and using arrays but I cannot use PHP here so I thought I could reproduce it in JQuery.
I am able to addClass "on" to selected menu items using the following:
<
script type=
"text/javascript"
>
$(
function
[Code]...
What I am trying to do here is us jQuery to show my button states. I have a page here test page I am using the hover event to do the up and over states, and using the click event for the down state. They all work but when I click the button it shows the down state but as soon as I move my mouse it goes back to the up state. I was hoping to be able to have it stay on the down state while on that page then when you click another button it changes back to up state and the one you clicked takes you to the that page and stays at the down state. I have the up and over state active for each button but only have the down state on the home button for testing.
Here is the code for the up and over states and the down state for the home button is at the end of the code.
I want to add a 'visited' class to a table cell and all of it's siblings if the link in the first td has been visited.
Here is my markup.
I've tried his:
And this:
And the class only gets added/appended to the table cells in FF, not webkit or IE and firebug tells me that the css is fine and would be applied if the class were present.
How can I add class to a list and the sub-list...? I have tried the code below but it wont work...
Code:
$(document).ready(function(){
$("#menu li:last").addClass('last');
$("#menu li li:last").addClass('sublast');
});
This is the html code which I add the class 'last' and 'sublast' manually... the ideal situation I wish to achieve is to add these classes through jquery. Is it possible??
HTML Code:
<div id="menu">
<ul>
<li><a href="#">NEWS</a>
<ul>
<li><a href="#">News</a></li>
<li><a href="#">Opportunities</a></li>
<li class="sublast"><a href="#">Newsletters</a></li> .....
I hope I'm posting in the right place. I looking to create an image banner rotater with tabs switching the images. On first click of a tab, I'm looking for the function to switch to that tab's associated image. After the image is active, the next time you click on that same tab, it would kick you to some URL within the site. It would function like on the Yahoo! homepage: the tab box with NEWS | WORLD | LOCAL | FINANCE
Does anyone know of an existing jQuery function to do this?
I'm working on a small plugin that extends a checkbox to behave as if it has 3 states. Basically it just adds an anchor above the underlying checkbox, intercepts mouse clicks, and cycles the checkbox between:
disabled + unchecked
enabled + unchecked
enabled + checked
It works fine in FF. But in IE7, for some reason, the click events are always sent to the underlying checkbox instead of the overlaid anchor. The anchor is sized to completely overlay the checkbox (and in fact, I made it's slightly bigger so clicking at the very edges
works). Incidentally, I'm using jQuery 1.2.6 since this is part of a much larger web application and we haven't yet worked out the incompatibilities we're seeing with the latest jQuery version.
Here's the plugin code (the alerts are for debugging in IE)
(function($) {
$.fn.checkbox3s = function(options) {
var opts = $.extend({}, $.fn.defaults, options);
return this.each(function() {
var proxy, cbx = $(this), parent = cbx.parent();
parent.css({position:"relative"});
proxy = $("<a href='#'></a>").css({
position:"absolute", .....
i have a group of check boxes, and i want to iterator over all the checked ones. i use the following code, but without luck.
$("input[type=checkbox][checked=true]").each(function()...);
[URL]
I currently have a website with a number of menu items, many of which result in the main site being redisplayed but with an iframe being inserted somewhere within the middle of the page. The iframe is initially loaded as hidden but there is a JavaScript 'onload' routine which calculates the height of the iframe and then makes it visible in order to avoid the iframe showing scrollbars since the content of the iframe is variable.
Roughly, things look like this:
Menu button: reloads main page and passes one or more parameters, e.g. [url]
Then elements of the main page including the menu are displayed. Then, if specified by the relevant 'func' parameter the iframe is shown using code similar to the following:
This works fine but I was wondering whether there is any way of using jQuery such that I don't have to reload the page when the menu item is clicked. In other words, you'd click on the menu item and the relevant iframe would be inserted within the middle of the website, automatically sized.
I am using the jquery splitter from [URL]My right pane is fully occupied by an iframe. The splitter doesn't work when I try to drag it over the iframe (drag to right) i.e. the iframe does not resize when the splitter is dragged over it, but the same iframe resizes when the splitter is dragged over the left pane (drag to left). The iframe is contained in a div tag as shown in the html below.
<html>
<body>
<div id="left"></div>
[code]....
I'm displaying 2 iframes on a page with content from other pages on the same domain. I'm using jQuery to apply a stylesheet to the 2 iframes.
$('#col1iframe, #col2iframe').load(function(){
$(this.contentDocument).find('head').append('<link rel="stylesheet" href="css/iframe-styles.css">');
$(this.contentDocument).find('a').attr({"target":"_top"});
[Code]...
.firstButton { background:url('../Images/leftCurve.png') bottom left no-repeat !important; }
.firstButton span { font-size:150px; }
There is a line like the following. $(afterButton).removeClass("firstButton").addClass("firstButton"); afterButton element is not null. But this object can not add a new class. Alert to look at the properties by the method of the object is added to a class. Why not work?
Anyone know why my jQuery IE8 menu isn't working? Works in FF:
HTML:
<html>
<head>
<link href="stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" />
[Code].....
the following works in FF but not in IE 6 nor IE 7
$('#msgsp').addClass('hidden');
$('#eventname').focus(
function() {
$(this).addClass('input_fields_focus');
}
);
that is IE the div #msgsp is not hidden and when focus on the input box #eventname the background color aint changed are there special methods/syntax for IE? are these methods intended to work in IE?
I have a strange problem that occurs in IE 7 and 8 and does not occur in Firefox or Safari.I'm dynamically adding class to a table row on a checkbox selection. A row contains some input fields that get enabled or disabled. If a row is enabled, it gets highlighted using selectedrow class. If it gets disabled, the class is removed:
[Code]...
I'm new using Jquery and I have a problem using addClass, removeClass.
This is the code that I have[code]...
I've been able to disable a checkbox when needed. This is fine, but on my
website, you don't really see that the checkbox is disabled. Does it exist a
way to show a red X in the middle of the checkbox instead of disable it, and
also avoid a user to click on it ?
In addition to an accordion-related problem in IE (see http://forum.jquery.com/topic/jquery-accordion-click-not-working-in-ie#14737000002219027), I'm having a headache regarding drop down menus. Again, this is only in IE (version 8) - every other browser in the known galaxy responds well to the JS and the HTML setup. The idea is there's a horizontal nav bar of five 'blocks', each with a heading. Hover over the heading and the 'block' (actually an <li>) extends to accommodate a small sentence underneath with a link. Hover off, and the block shrinks back to its original form, with the link hidden. All good in FF, Opera, Safari, Chrome. In IE, though, the <li> block doesn't extend - the link is shown beneath it, but it's outside its frame and looks awful.
[Code]...
I'd love to ignore this but I don't know how to tell my client "It's all good, just don't use Internet Explorer".
It's just a simple jquery pricing calculator. The problem is the original code given was for checkboxes only I suppose. I am wanting to use list/menu as well. The list menu works and adds the values fine in FF, but not in IE
[Code]...
I just started with jquery because I need a solution for a website that doesn't involve flash. I found this tutorial [URL]and I tried to modify the code without realy knowing what I'm doing, needless to say, it's not working at all.
Basically I have the same idea for my menu but it looks a bit different, instead of using a line underneath the links I want the scroller-image to tween on the x-axis with the white line stopping in the middle of each button. I made the image to fill the whole page so that it covers the scroller-line image underneath, I want the effect of a line expanding and contracting and this is the only way I could figure to do it.
css:
.nav-scroller-container
{
width:900px;
height:75px;
[Code].....
If I use jQuery 1.2.6 it work, but if I use last version 1.6 it stop working.
$(document).ready(function() {
$('div.menu:eq()> div.subnav').hide();
$('div.menu:eq()> div.navhead').click(function() {
$(this).next().slideToggle('fast');
});
I am trying to write a background image swapper, which I have got working. Ideally I would like to add a transition between the classes I am changing.
I am new to jquery, and I thought this would be a simple project to start on, but I just can't get the fade to work. see below for my code:
[Code]...
I have html code:
<div id="dropdown" class="rMenu">
<ul id="middlemenu" class="rMenu-hor rMenu">
<li><a href="page.html">Page</a></li>
[code]....
$('body').append('<div id="mydiv"></div>).addClass('newClass');addClass can be used to add a class to a selector. Take the above example. If the class is added to 'mydiv' instead, not body, this could be handy than writing the two lines:$('body').append('<div id="mydiv"></div>);$('#mydiv').addClass('newClass');
View 4 Replies View RelatedHow can I add an class to my <TR> when the date is expired?
[Code]...
I have what I'm certain amounts to a CSS misunderstanding on my part. Here's the reduced problem:
CSS
input[type='text'], textarea {
background-color: #2c2c2c;
color: white; }
[Code]....
The problem: The addClass does not affect the styling of #title. Firebug shows .error, but as an empty selector. And, BTW, is this an appropriate way to flag errors -- by adding or removing a class?
I'm trying to write a cinema seat selection page and I'm hitting a problem with a selector not recognising a 'booked' class that I've just been added via JSON. I wonder if anyone could tell me why it works ok when I hard code the 'booked' class in but not when I do it through jQuery. Should I just do it in PHP??? or is there a way around the problem.
[Code]...