[jQuery] Re: Jquery suitable for advanced webapplication
Thank you for the feedback and tips! Does anybody has experience with some sort of statemanager where you can control the different states of your interface, sort of a controller? On 12 nov, 08:49, Sn3b sebastien.desalva...@gmail.com wrote: Btw, you will want to read this as you start coding :)http://www.tvidesign.co.uk/blog/improve-your-jquery-25-excellent-tips...
[jQuery] Re: Are there any specific reason why the Jquery library returns a lot of errors in the Firefoxx error console?
Hi What I mean is that I get a lot of Jquery CSS errors/warnings in Firefox error console ,like if I visit this page http://jqueryui.com/demos/draggable/ I get 9 errors in the Varning: http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css So I wonder if this is by design to have these flaws to make it 100% browser compatible? Why I also ask is that I have clients who doesn't want to use it due to all these warnings/errors (this is true!) PS, I do love Jquery by the way.
Re: [jQuery] Re: Are there any specific reason why the Jquery library returns a lot of errors in the Firefoxx error console?
Ok, so, first of all error # warning. An error means something has gone wrong, sometimes horribly, a warning merely means something may possibly be a mistake, or not. Especially css warnings, which basically means oh, I don't know this one (I'd even be so bold as to add could that be an Internet Explorer specific rule that is meant to mean nothing by me, Firefox). But I wonder about those of your clients that are worried about that, are they the same people that use tables as a positionning system because at least it works the same on IE and Firefox, so, hey, let's be pragmatic lad ?... The very same that sometimes think that it's a good idea to place a link in another link, cause, hey, we need this one clickable and this other clickable in it and we have to make it work in IE so ?... The kind of people that, when faced with the need to place blocks in line think well, let's do it all with floats cause that basically what float is for, don't give me any of this inline-block nonesense, the stuff's for wuss ?... Because if they are, well, I wouldn't bother too much about their opinion on what's clean and what's not. Michel Belleville 2009/11/12 Sune42 sun...@hotmail.com Hi What I mean is that I get a lot of Jquery CSS errors/warnings in Firefox error console ,like if I visit this page http://jqueryui.com/demos/draggable/ I get 9 errors in the Varning: http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css So I wonder if this is by design to have these flaws to make it 100% browser compatible? Why I also ask is that I have clients who doesn't want to use it due to all these warnings/errors (this is true!) PS, I do love Jquery by the way.
[jQuery] embed java applets in div element using jquery
Hi All,
I am embedding a java applet into one of the div elements in a page.
div id=appletHere/div
and jquery function is
$(document).ready(function(){
$('#appletHere').append('
script type=text/javascript
jmolApplet(load somefile.pdb);
/script
');
});
The applet loads fine but it is not getting embedded into the div element as
required- instead ,
the applet loaded page has only html body object elements (with
applet).
(the div element is gone and other styling is gone)
so how do i make sure that the applet loads in the specified div element
without messing up with the page styling ?
thanks in advance.
regards,
Krishna
[jQuery] Re: embed java applets in div element using jquery
just to update-
I am using jquery 1.3.2 , jquery-ui 1.7.2 and java 1.6 with firefox 3.5.5
(firebug 1.4.5)
Krishna
On Thu, Nov 12, 2009 at 6:27 PM, km srikrishnamo...@gmail.com wrote:
Hi All,
I am embedding a java applet into one of the div elements in a page.
div id=appletHere/div
and jquery function is
$(document).ready(function(){
$('#appletHere').append('
script type=text/javascript
jmolApplet(load somefile.pdb);
/script
');
});
The applet loads fine but it is not getting embedded into the div element
as required- instead ,
the applet loaded page has only html body object elements (with
applet).
(the div element is gone and other styling is gone)
so how do i make sure that the applet loads in the specified div element
without messing up with the page styling ?
thanks in advance.
regards,
Krishna
Re: [jQuery] Re: Load image with an ajax preloader?
You may also like this nifty little trick :
$('#myImage').attr('src', 'image.jpg').load(function() { alert(
'Image Loaded'); });
Apparently images does use the .load() event callback.
Michel Belleville
2009/11/10 Michel Belleville michel.bellevi...@gmail.com
This is straight JS, I never used it before and I'm not sure how
cross-browser it is but this should help :
http://talideon.com/weblog/2005/02/detecting-broken-images-js.cfm
Michel Belleville
2009/11/10 123gotoandplay wesweatyous...@gmail.com
Hi michel,
Tx for the explanation, i am trying your suggestion and it indeed
works like a charm.
At the moment i am updating div imagePreview depending on a combo of
select menu options.
As i understand it the ajax-loader.gif keeps on spinning in the
background.
Is there a way to check if the image is really loaded and if not
display another image as background saying no image found.
working code at the moment
$(#size_update).change(function(){
var srcSize = $(option:selected, this).val();
var srcColor = $(#color_update option:selected).text();
var imgSrc = srcColor+-+srcSize;
$('#imagePreview').html('img src='+imgSrc+'.jpg/');
});
$(#color_update).change(function(){
var srcColor = $(option:selected, this).val() ;
var srcSize = $(#size_update
option:selected).text();
var imgSrc = srcColor+-+srcSize;
$('#imagePreview').html('img
src='+imgSrc+'.jpg/');
});
.loading {
background: url(ajax-loader.gif) no-repeat center center;
}
[jQuery] Re: post AJAX no response
Hi,
I'm back again with this AJAX post problem.
I've used HttpFox FF extension and I've got some extra information.
The post call is aborted. I got next message using HttpFox extension:
Method: post
Time: 0.451
Result: Aborted
Type: NS_BINDING_ABORTED
This happens when I use a low band internet connection. When I used a
high band connection the problem doesn't come up.
The post callback function is never called. It only has to receive an
XML document which is around 3/11 KBytes
On 8 oct, 19:50, David garcia.narb...@gmail.com wrote:
Hi Doug,
yes, I am sure the data loads correctly, as this post call is
requested once you select an option in a select list.
I have an alert message just before the post call and I can see the
'selected_data' parameter.
In fact, as I have said, the request is well done, as the server sends
the output. The point is this data does not get to the browser.
Thanks Doug.
On 8 oct, 20:45, Knight, Doug dkni...@mitre.org wrote:
Hi David,
Do you have your call inside a $(document).ready? It may be that in a high
bandwidth environment your data loads completely before your call is
triggered, whereas in a low bandwidth environment your page has the chance
to finish loading before the data makes it to your call.
My two cents,
Doug
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
Behalf Of David
Sent: Thursday, October 08, 2009 2:40 PM
To: jQuery (English)
Subject: [jQuery] post AJAX no response
Hi,
I have a problem with an AJAX call. It's a long time since a got it. I
don't know how to deal with it. I have made tests and I don't know why
it's happening.
I have a post AJAX call. Just like next one:
$.post(MY_SCRIPT, { db_id: selected_data},
function(data){
...
});
The problem is, some times it returns data, and some times it doesn't.
I have test it with FF and Chrome, it doesn't mater the browser.
It has nothing to do with domain server crossing, nor server errors,
as it some times works and some times it doesn't.
What I have found is, it works most of the times in a high bandwith
connection (enterprise bandwith). Buit when I try it at home, most of
the times it does not work. The function does not receive any data
from the server.
I have checked the server when it happens, and the server returns
data. It is as if the data got lost in the response.
I don't know what to do, as I don't know where the problem is.
Thanks
[jQuery] Is FullCalendar Able To Handle Multiple Google Calendars?
I have been exploring the FullCalendar plugin (http://arshaw.com/ fullcalendar/), which works nicely. I have been able to display information from one of my Google calendars, but have not had success with multiple calendars. Does anyone know if this is possible? Thanks - george
Re: [jQuery] Re: Load image with an ajax preloader?
On Nov 12, 2009, at 6:10 AM, Michel Belleville wrote:
You may also like this nifty little trick :
$('#myImage').attr('src', 'image.jpg').load(function()
{ alert('Image Loaded'); });
Apparently images does use the .load() event callback.
Michel Belleville
Good point, Michel. You have to be careful, though, because IE won't
report cached images as loaded that way. Instead you need to check the
image's .complete property. You might also want to handle images that
don't load properly. Someone (can't remember who) recently pointed me
to an article that discusses the complexities involved and provides a
function:
http://lucassmith.name/2008/11/is-my-image-loaded.html
(beware the first helper function)
Cheers,
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
[jQuery] jquery tabs not on the same row! help please!
Hi there,
I'm just starting to learn jquery and trying to implement tabs onto my
aspx page...The problem is that the tabs are showing up one on top of
anotherhow do i get the tabs to line up in a row? I'm using
jquery 1.2.6...all the js's (ui.core.js, ui.tabs.js) are included in
my masterpage.
any help is appreciated!
thanks!
my code follows:
ASPX:
%@ Page Title= Language=C# MasterPageFile=~/Master.Master
AutoEventWireup=true CodeBehind=WebForm1.aspx.cs
Inherits=ctc3.test.WebForm1 %
asp:Content ID=Content1 ContentPlaceHolderID=head runat=server
/asp:Content
asp:Content ID=Content2 ContentPlaceHolderID=phEmailGoalsheet
runat=server
/asp:Content
asp:Content ID=Content3 ContentPlaceHolderID=ContentPlaceHolder1
runat=server
script type=text/javascript
$(function() {
$(#tabs).tabs();
});
/script
div id=tabs class=ui-tabs-nav
ul
lia href=#tabs-1Nunc tincidunt/a/li
lia href=#tabs-2Proin dolor/a/li
lia href=#tabs-3Aenean lacinia/a/li
/ul
div id=tabs-1
pProin elit arcu, rutrum commodo, vehicula tempus, commodo
a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.
Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem.
Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo.
Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam
sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat.
Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci
tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus./p
/div
div id=tabs-2
pMorbi tincidunt, dui sit amet facilisis feugiat, odio metus
gravida ante, ut pharetra massa metus id nunc. Duis scelerisque
molestie turpis. Sed fringilla, massa eget luctus malesuada, metus
eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet
fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam.
Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis.
Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra
nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas
feugiat, tellus pellentesque pretium posuere, felis lorem euismod
felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et
purus./p
/div
div id=tabs-3
pMauris eleifend est et turpis. Duis id erat. Suspendisse
potenti.
Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat,
eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent
taciti sociosqu ad litora torquent per conubia nostra, per inceptos
himenaeos. Fusce sodales. Quisque eu urna vel enim commodo
pellentesque. Praesent eu risus hendrerit ligula tempus pretium.
Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus./p
pDuis cursus. Maecenas ligula eros, blandit nec, pharetra at,
semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra
justo vitae neque. Praesent blandit adipiscing velit. Suspendisse
potenti. Donec mattis, pede vel pharetra blandit, magna ligula
faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque.
Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi
lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean
vehicula velit eu tellus interdum rutrum. Maecenas commodo.
Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus
hendrerit hendrerit./p
/div
/div
!-- End demo --
/asp:Content
[jQuery] Re: Calling function in jQuery
Hi Dhruva,
I've tried to implement this, with the following code:
(function($) {
$.dave = function() {
alert('in function');
}
})(jQuery);
$(document).ready(function(){
$.dave();
});
which does nothing, I'm guessing as I'm new to this I've missed
something simple, can you see an error in my code, I'd be hugely
appreciative if you could look.
Thanks,
Adam.
On Nov 10, 1:54 am, Dhruva Sagar dhruva.sa...@gmail.com wrote:
The function by itself will not be available within other blocks, since the
function is in local scope.
You should attach the function to the jQuery object instead for later use
using the following syntax :
(function($) {
$.function_name = function test() {
alert('in function');
}
})(jQuery);
Then later in other jQuery blocks (although you will have to ensure that
your previously defined block has been already included) you can call your
function simply by using $.function_name();
Thanks Regards,
Dhruva Sagar.
On Mon, Nov 9, 2009 at 4:27 PM, Murali Krishna B
muralikrishna.vi...@gmail.com wrote:
Hi all,
I am creating a function using jQuery in application.js file.
(function($) {
function test() {
alert('in function');
}
})(jQuery);
When I am trying to call this function from outside (not in this jQuery
block), I am getting an error saying that function is not defined.
I am including this file, also I am calling this function from a jQuery
block. Still I am getting this error.
How to call that function?
Also, I am facing another issue. I have a form with select option. It will
be populated dynamically after every ajax request.
In form, I have a select tag with no options.
select id='users'
/select
After getting a content from ajax, I am preparing all the available
options, and placing that content in select tag.
var opts = option value='1'Murali/optionoption
value='2'Krishna/option;
$(#users).html(opts);
But it is not showing any options in the select tag.
Pls help me,
--
Thanks Regards,
Murali Krishna.B
[jQuery] jQuery newbie is looking for a hint. (dynamically add div tags to html :: plugin accordion)
Hi
I'm a total newbie to jQuery and need a hint.
I have a site that has a structure like this which is used for
accordion plugin:
(html content is set by TinyMC RTE Editor)
div class=modAccordion
h3header 1/h3
psome text/p
psome other text/p
h3header 2/h3
psome text/p
ul
lilist element 1/li
lilist element 2/li
/ul
h3header 3/h3
psome text/p
psome other text/p
psome more text/p
psome different text/p
/div
In order to make it work properly i need to add div tags. The
structure should then look like this:
div class=modAccordion
h3header 1/h3
div
psome text/p
psome other text/p
/div
h3header 2/h3
div
psome text/p
ul
lilist element 1/li
lilist element 2/li
/ul
/div
h3header 3/h3
div
psome text/p
psome other text/p
psome more text/p
psome different text/p
/div
/div
So inside the modAccordion div container I need to add div tags.
The logic is:
After each closing h3 tag (/h3) inside modAccordion container append
an opening div (div) tag.
Before every opening h3 tag (h3) but not before the first opening h3
tag add a closing div (/div) tag.
Finally before the closing div tag from the modAccordion container,
add a closing div (/div) tag.
That should make modAccordion work propperly.
I was playing around with some jQuery code (Sorry, I'm really a
beginner, it's the first time I'm using jQuery).
My trying so far, just to see how the code works and will output
(alert):
script type=text/javascript
$(document).ready(function(){
alert(getAllBetween(h3,h3));
alert($(h3).nextAll().not(h3).text());
alert($(h3).nextAll().not(h3).html());
alert($(h3).next().not(h3).html());
alert($(h3).next().not(h3).text());
});
function getAllBetween(firstEl,lastEl) {
var firstElement = $(firstEl); // First Element
var lastElement = $(lastEl); // Last Element
var collection = new Array(); // Collection of Elements
collection.push(firstElement); // Add First Element to
Collection
$(firstEl).nextAll().each(function(){ // Traverse all
siblings
var siblingID = $(this).attr(id); // Get Sibling ID
if (siblingID != $(lastElement).attr(id)) { // If Sib
is
not LastElement
collection.push($(this)); // Add Sibling to
Collection
} else { // Else, if Sib is LastElement
return false; // Break Loop
}
});
return collection; // Return Collection
}
$(function() {
$(.modAccordion).accordion();
});
/script
I'm thankfull for any hint which approach I should/ could use, also
sample code would be appreciated.
Thanks in advance!
hagbard
[jQuery] JQuery and Mootools still not working
Hi,
I am unable to get jquery and the barackslideshow working on the same
page. I have been struggling for hours and it is an urgent thing. I
researched and found the noConflict and after a while realized the
correct order to put it in for it to work. And it works great - in
Chrome and Firefox. In I.E. the barackslideshow I have doesn't fade
out it just jumps to the next image with no transition. Here is my
code:
CODE
script type=text/javascript charset=utf-8 src=js/mootools-1.2.1-
core-yc.js/script
script type=text/javascript charset=utf-8 src=js/
mootools-1.2.2.2-more.js/script
script type=text/javascript charset=utf-8 src=js/jquery.js/
script
scriptjQuery.noConflict();/script
script type=text/javascript charset=utf-8 src=js/
Fx.MorphList.js/script
script type=text/javascript charset=utf-8 src=js/
BarackSlideshow.js/script
script
window.addEvent('domready', function(){
var slideshow = new BarackSlideshow('menu', 'pictures', 'loading',
{transition: 'fade', autostart: true, auto: true, tween: { duration:
2500 }, autointerval: 4000 });
});
/script
script
function refreshContent(section) {
jQuery(#section).fadeOut(slow, function(){
jQuery(#section).load(ajaxcontent.php?section=+section,false,
function() {
jQuery(#section).fadeIn(slow);
});
})
return false;
}
/script
script language=JavaScript type=text/javascript
/*![CDATA[*/
var Lst;
function CngClass(obj){
if (Lst) Lst.className='';
obj.className='active';
Lst=obj;
}
/*]]*/
/script
/CODE
I would appreciate any help!!!
Thanks,
Ryan
[jQuery] Autocomplete , inseting text
This is a newbie question. I want to use the jQuery autocomplete for injecting text in the middle of another text, inside a text area. I mean, I have a textarea that may already contain some text. I want to set the cursor anywhere in that text and start typing. The autocomplete box pops up and shows me the available options that match what I started typing. When I select one of the options, it is inserted at the initial cursor position. Can I do that with the jQuery autocomplete? Thanks
[jQuery] Conditionally format rows in a table
I have the following code:
$().ready(function() {
$(td:contains('HENGELO')).parent().children().addClass
('red');
});
Now I want to get the condition from an ASP control for example a
dropdown or a listbox. How do I use the value of this control in my
jQuery code?
[jQuery] VALIDATE change errormessage
Moin,
sorry, i dont get it: how to change the error message for all fields
This field is required.
script type=text/javascript src=http://dev.jquery.com/view/trunk/
plugins/validate/jquery.validate.js/script
script
$(document).ready(function(){
$(#mainform).validate();
});
/script
thanks,
fyp
[jQuery] Division Blocking is not working
Hi ,
I am using jQuery BlockUI Plugin (v2) in my project ,Block UI
is working fine in my project. when i am trying to block particular
Division its not working. Please check the following code and reply
soon.
Thanks in advance
MY Code :
%@ Page Language=C# AutoEventWireup=true
CodeFile=Default.aspx.cs Inherits=_Default %
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
html xmlns=http://www.w3.org/1999/xhtml;
head runat=server
titleUntitled Page/title
script type =text/javascript src =jquery-1.3.2.min.js /
script
script src=jqueryblockui.js type=text/javascript/script
script type=text/javascript
$(document).ready(function() {
$('#blk').click(function() {
alert('blk clicked');
$('div.question').block({ message: null });
});
$('#unblk').click(function() {
alert('unblk clicked');
$('div.question').unblock();
});
$('a.test').click(function() {
alert('link clicked');
return false;
});
});
/script
/head
body
form id=form1 runat=server
input type=button id=blk value=Yes1 /
input type=button id=unblk value=No1 /
div id=question
h1Would you like to contine?./h1
input type=button id=yes value=Yes /
input type=button id=no value=No /
/div
/form
/body
/html
Re: [jQuery] embed java applets in div element using jquery
Try:
$('#appletHere').html('
script type=text/javascript
jmolApplet(load somefile.pdb);
/script
');
But it might not help if your javascript or java applet does something like
ocument.write(content);
You probably *could* move your created DOM objects after they have
been injected into the page to the desired location.
If you need help with functional code snippets, you will need to
provide more info (how does your initial HTML and JS files look, how
does your DOM look after it has been manipulated, or better share a
link)
On Thu, Nov 12, 2009 at 11:27 AM, km srikrishnamo...@gmail.com wrote:
Hi All,
I am embedding a java applet into one of the div elements in a page.
div id=appletHere/div
and jquery function is
$(document).ready(function(){
$('#appletHere').append('
script type=text/javascript
jmolApplet(load somefile.pdb);
/script
');
});
The applet loads fine but it is not getting embedded into the div element as
required- instead ,
the applet loaded page has only html body object elements (with
applet).
(the div element is gone and other styling is gone)
so how do i make sure that the applet loads in the specified div element
without messing up with the page styling ?
thanks in advance.
regards,
Krishna
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
Re: [jQuery] jquery tabs not on the same row! help please!
This is a CSS issue, not really related to jQuery.
Do something like this in your CSS file:
/* Forcing the ul to take not of its floated children. */
#tabs ul { display: inline-block; overflow: hidden; }
#tabs ul { display: block; }
/* Floating the children */
#tabs li { float: left; }
2009/11/12 AdyLim lim...@gmail.com:
Hi there,
I'm just starting to learn jquery and trying to implement tabs onto my
aspx page...The problem is that the tabs are showing up one on top of
anotherhow do i get the tabs to line up in a row? I'm using
jquery 1.2.6...all the js's (ui.core.js, ui.tabs.js) are included in
my masterpage.
any help is appreciated!
thanks!
my code follows:
ASPX:
%@ Page Title= Language=C# MasterPageFile=~/Master.Master
AutoEventWireup=true CodeBehind=WebForm1.aspx.cs
Inherits=ctc3.test.WebForm1 %
asp:Content ID=Content1 ContentPlaceHolderID=head runat=server
/asp:Content
asp:Content ID=Content2 ContentPlaceHolderID=phEmailGoalsheet
runat=server
/asp:Content
asp:Content ID=Content3 ContentPlaceHolderID=ContentPlaceHolder1
runat=server
script type=text/javascript
$(function() {
$(#tabs).tabs();
});
/script
div id=tabs class=ui-tabs-nav
ul
lia href=#tabs-1Nunc tincidunt/a/li
lia href=#tabs-2Proin dolor/a/li
lia href=#tabs-3Aenean lacinia/a/li
/ul
div id=tabs-1
pProin elit arcu, rutrum commodo, vehicula tempus, commodo
a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.
Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem.
Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo.
Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam
sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat.
Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci
tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus./p
/div
div id=tabs-2
pMorbi tincidunt, dui sit amet facilisis feugiat, odio metus
gravida ante, ut pharetra massa metus id nunc. Duis scelerisque
molestie turpis. Sed fringilla, massa eget luctus malesuada, metus
eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet
fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam.
Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis.
Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra
nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas
feugiat, tellus pellentesque pretium posuere, felis lorem euismod
felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et
purus./p
/div
div id=tabs-3
pMauris eleifend est et turpis. Duis id erat. Suspendisse
potenti.
Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat,
eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent
taciti sociosqu ad litora torquent per conubia nostra, per inceptos
himenaeos. Fusce sodales. Quisque eu urna vel enim commodo
pellentesque. Praesent eu risus hendrerit ligula tempus pretium.
Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus./p
pDuis cursus. Maecenas ligula eros, blandit nec, pharetra at,
semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra
justo vitae neque. Praesent blandit adipiscing velit. Suspendisse
potenti. Donec mattis, pede vel pharetra blandit, magna ligula
faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque.
Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi
lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean
vehicula velit eu tellus interdum rutrum. Maecenas commodo.
Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus
hendrerit hendrerit./p
/div
/div
!-- End demo --
/asp:Content
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
Re: [jQuery] jquery tabs not on the same row! help please!
This is a css question rather than jQuery, though the answer goes as follow
:
1. you're using an ul with li inside
2. ul work as block elements containing li which are block elements too
3. block elements pile up on top of one another unless told otherwise
What you need is made them act as inline, the best way (a bit harder in the
short term, a lot easier in the long term) is to use inline-block
positioning, and hack IE (remember, no matter what you do in css, you'll
probably have to hack IE).
This may help :
http://homepage.ntlworld.com/spartanicus/ie_block_level_element_inline-block_hack.htm
Michel Belleville
2009/11/12 AdyLim lim...@gmail.com
Hi there,
I'm just starting to learn jquery and trying to implement tabs onto my
aspx page...The problem is that the tabs are showing up one on top of
anotherhow do i get the tabs to line up in a row? I'm using
jquery 1.2.6...all the js's (ui.core.js, ui.tabs.js) are included in
my masterpage.
any help is appreciated!
thanks!
my code follows:
ASPX:
%@ Page Title= Language=C# MasterPageFile=~/Master.Master
AutoEventWireup=true CodeBehind=WebForm1.aspx.cs
Inherits=ctc3.test.WebForm1 %
asp:Content ID=Content1 ContentPlaceHolderID=head runat=server
/asp:Content
asp:Content ID=Content2 ContentPlaceHolderID=phEmailGoalsheet
runat=server
/asp:Content
asp:Content ID=Content3 ContentPlaceHolderID=ContentPlaceHolder1
runat=server
script type=text/javascript
$(function() {
$(#tabs).tabs();
});
/script
div id=tabs class=ui-tabs-nav
ul
lia href=#tabs-1Nunc tincidunt/a/li
lia href=#tabs-2Proin dolor/a/li
lia href=#tabs-3Aenean lacinia/a/li
/ul
div id=tabs-1
pProin elit arcu, rutrum commodo, vehicula tempus, commodo
a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.
Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem.
Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo.
Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam
sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat.
Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci
tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus./p
/div
div id=tabs-2
pMorbi tincidunt, dui sit amet facilisis feugiat, odio
metus
gravida ante, ut pharetra massa metus id nunc. Duis scelerisque
molestie turpis. Sed fringilla, massa eget luctus malesuada, metus
eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet
fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam.
Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis.
Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra
nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas
feugiat, tellus pellentesque pretium posuere, felis lorem euismod
felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et
purus./p
/div
div id=tabs-3
pMauris eleifend est et turpis. Duis id erat. Suspendisse
potenti.
Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat,
eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent
taciti sociosqu ad litora torquent per conubia nostra, per inceptos
himenaeos. Fusce sodales. Quisque eu urna vel enim commodo
pellentesque. Praesent eu risus hendrerit ligula tempus pretium.
Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus./p
pDuis cursus. Maecenas ligula eros, blandit nec, pharetra
at,
semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra
justo vitae neque. Praesent blandit adipiscing velit. Suspendisse
potenti. Donec mattis, pede vel pharetra blandit, magna ligula
faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque.
Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi
lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean
vehicula velit eu tellus interdum rutrum. Maecenas commodo.
Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus
hendrerit hendrerit./p
/div
/div
!-- End demo --
/asp:Content
Re: [jQuery] Conditionally format rows in a table
$('#select').val() will return the value of the selected item
But I'm not seeing *how* this has anything to do with the example you posted.
On Thu, Nov 12, 2009 at 8:14 AM, Marcel Roesink mg.roes...@gmail.com wrote:
I have the following code:
$().ready(function() {
$(td:contains('HENGELO')).parent().children().addClass
('red');
});
Now I want to get the condition from an ASP control for example a
dropdown or a listbox. How do I use the value of this control in my
jQuery code?
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
Re: [jQuery] jquery tabs not on the same row! help please!
Also, you'd better not use floating positioning (easier on the very short
term, a lot more complicated in mid-long term).
Michel Belleville
2009/11/12 Andrei Eftimie k3liu...@gmail.com
This is a CSS issue, not really related to jQuery.
Do something like this in your CSS file:
/* Forcing the ul to take not of its floated children. */
#tabs ul { display: inline-block; overflow: hidden; }
#tabs ul { display: block; }
/* Floating the children */
#tabs li { float: left; }
2009/11/12 AdyLim lim...@gmail.com:
Hi there,
I'm just starting to learn jquery and trying to implement tabs onto my
aspx page...The problem is that the tabs are showing up one on top of
anotherhow do i get the tabs to line up in a row? I'm using
jquery 1.2.6...all the js's (ui.core.js, ui.tabs.js) are included in
my masterpage.
any help is appreciated!
thanks!
my code follows:
ASPX:
%@ Page Title= Language=C# MasterPageFile=~/Master.Master
AutoEventWireup=true CodeBehind=WebForm1.aspx.cs
Inherits=ctc3.test.WebForm1 %
asp:Content ID=Content1 ContentPlaceHolderID=head runat=server
/asp:Content
asp:Content ID=Content2 ContentPlaceHolderID=phEmailGoalsheet
runat=server
/asp:Content
asp:Content ID=Content3 ContentPlaceHolderID=ContentPlaceHolder1
runat=server
script type=text/javascript
$(function() {
$(#tabs).tabs();
});
/script
div id=tabs class=ui-tabs-nav
ul
lia href=#tabs-1Nunc tincidunt/a/li
lia href=#tabs-2Proin dolor/a/li
lia href=#tabs-3Aenean lacinia/a/li
/ul
div id=tabs-1
pProin elit arcu, rutrum commodo, vehicula tempus, commodo
a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.
Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem.
Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo.
Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam
sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat.
Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci
tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus./p
/div
div id=tabs-2
pMorbi tincidunt, dui sit amet facilisis feugiat, odio
metus
gravida ante, ut pharetra massa metus id nunc. Duis scelerisque
molestie turpis. Sed fringilla, massa eget luctus malesuada, metus
eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet
fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam.
Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis.
Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra
nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas
feugiat, tellus pellentesque pretium posuere, felis lorem euismod
felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et
purus./p
/div
div id=tabs-3
pMauris eleifend est et turpis. Duis id erat.
Suspendisse potenti.
Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat,
eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent
taciti sociosqu ad litora torquent per conubia nostra, per inceptos
himenaeos. Fusce sodales. Quisque eu urna vel enim commodo
pellentesque. Praesent eu risus hendrerit ligula tempus pretium.
Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus./p
pDuis cursus. Maecenas ligula eros, blandit nec,
pharetra at,
semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra
justo vitae neque. Praesent blandit adipiscing velit. Suspendisse
potenti. Donec mattis, pede vel pharetra blandit, magna ligula
faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque.
Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi
lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean
vehicula velit eu tellus interdum rutrum. Maecenas commodo.
Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus
hendrerit hendrerit./p
/div
/div
!-- End demo --
/asp:Content
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
[jQuery] Re: Division Blocking is not working
Your selector of
$('div.question').block();
is wrong as that looks for a div with a class of question
your HTML of div id=question
would be found by
$('#question').block();
On Nov 12, 7:52 am, azy azymd...@gmail.com wrote:
Hi ,
I am using jQuery BlockUI Plugin (v2) in my project ,Block UI
is working fine in my project. when i am trying to block particular
Division its not working. Please check the following code and reply
soon.
Thanks in advance
MY Code :
%@ Page Language=C# AutoEventWireup=true
CodeFile=Default.aspx.cs Inherits=_Default %
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head runat=server
titleUntitled Page/title
script type =text/javascript src =jquery-1.3.2.min.js /
script
script src=jqueryblockui.js type=text/javascript/script
script type=text/javascript
$(document).ready(function() {
$('#blk').click(function() {
alert('blk clicked');
$('div.question').block({ message: null });
});
$('#unblk').click(function() {
alert('unblk clicked');
$('div.question').unblock();
});
$('a.test').click(function() {
alert('link clicked');
return false;
});
});
/script
/head
body
form id=form1 runat=server
input type=button id=blk value=Yes1 /
input type=button id=unblk value=No1 /
div id=question
h1Would you like to contine?./h1
input type=button id=yes value=Yes /
input type=button id=no value=No /
/div
/form
/body
/html
Re: [jQuery] Get the real html from an iFrame
Do either of these work?
var html = parent.$('#indexIframe').contents().html();
var html = parent.$('#indexIframe').contents();
On Wed, Nov 11, 2009 at 9:49 AM, m.ugues m.ug...@gmail.com wrote:
Hallo all.
I have an iframe with an id.
I need to get the html content of this iframe.
So from the iframe doc read I tried like this
var html = parent.$('#indexIframe').contents().find('html').html()
In this way I get the content of the tag html of the iframe, so the
head definition and the body definition.
head.../head
body.../body
I would like to get the parent tag in a way to have:
html
head.../head
body.../body
/html
Any idea?
Kind regards
Massimo
[jQuery] Re: Are there any specific reason why the Jquery library returns a lot of errors in the Firefoxx error console?
What I mean is that I get a lot of Jquery CSS errors/warnings in
Firefox error console ,like if I visit this page
Well, let's look at one:
From the Firefox error console:
Warning: Error in parsing value for 'cursor'. Declaration dropped.
Source File: http://static.jquery.com/ui/css/base2.css
Line: 865
That line is:
#widget-docs .option-header dd span:hover { border-bottom: 1px dashed
#000; color: #999; cursor: pointer; cursor: hand; }
So both pointer and hand are listed.. why? because
according to quirksmode.org. IE 5.5 doesn't support pointer (http://
www.quirksmode.org/css/cursor.html) so both are put into the CSS,
any browser supporting pointer, which is pretty much any browser
newer than 6-7 years old at this point, just drops the style
most of those warnings are because of IE-specific situations just like
that. if that's a deal breaker for your clients, they do not
understand the internet and what it takes to create an application
that works no matter what the browser... you could go through the CSS
and remove every IE specific declaration, but now you'd have to
support two copies of the file, one for IE, one for everyone else.
Re: [jQuery] Re: Are there any specific reason why the Jquery library returns a lot of errors in the Firefoxx error console?
2009/11/12 MorningZ morni...@gmail.com you could go through the CSS and remove every IE specific declaration, but now you'd have to support two copies of the file, one for IE, one for everyone else. If only 2 copies were enough here... More like 2+ copies depending on how many versions of IE you wish to support (although I never in my whole professional life wished I'd support IE ; anyway I wished IE would support a lot of things, so I guess that counts in a weird way). Michel Belleville
[jQuery] Change style of Div with fade
Hi, Can anyone tell me how to rotate the background-color style of a div with a fade? I need it to rotate colors every 10 seconds, having one fade into the next, and will need to have 3 background colors, then keep looping from the first color. My Div is named #rotateBG. Thanks
[jQuery] Re: button value change
Thanks but this won't work for a input type=button .../ ? David
Re: [jQuery] Re: button value change
David,
You are correct, that wont work for the input element. Sorry about that. I
guess I got focused on the first part of your email and the a element.
I'm wondering if you thought about why the code I provided didn't work? You
might want to review the jQuery documentation and the tutorials:
- http://docs.jquery.com/Main_Page
- http://docs.jquery.com/Tutorials
Here's why, because the text attribute doesn't exist for your input tag, it
doesn't have a text attribute (ok as enhanced by jQuery).
When the input element is created like this, then you'd have to change the
value attribute. This would then change the text that is displayed to the
user. (Note this also changes the value you'd receive on the server end.)
If you had used the button element, then changing the text attribute would
have worked.
Here is some more modified code for you to play.
html
head
titleTest Page/title
script src='jquery.js' type='text/javascript'/script
script type=text/javascript
$(function() {
$('#frm1').submit( function(event) {
event.preventDefault();
event.stopPropagation();
});
$('#btn1').toggle(
function(event) {
$(this).attr('value','Hide Details');
},
function(event) {
$(this).attr('value','More Details');
}
);
$('#btn2').toggle(
function(event) {
$(this).text('Hide Details');
},
function(event) {
$(this).text('More Details');
}
);
});
/script
/head
body
form id='frm1' method='post' action=''
input id='btn1' type='button' value='More Details' /
button id='btn2' type='button'More Details/button
/form
/body
/html
HTH,
Joe
On Thu, Nov 12, 2009 at 9:30 AM, David pr davidpric...@gmail.com wrote:
Thanks but this won't work for a input type=button .../ ?
David
Re: [jQuery] jquery tabs not on the same row! help please!
Sorry for thread-hijacking, but why would you say that floats are complicated?
Right now (as in current browser implementations) floats work really reliably.
(with 1 small IE bug with an easy fix)
inline-block needs to be hacked in multiple browsers
2009/11/12 Michel Belleville michel.bellevi...@gmail.com:
Also, you'd better not use floating positioning (easier on the very short
term, a lot more complicated in mid-long term).
Michel Belleville
2009/11/12 Andrei Eftimie k3liu...@gmail.com
This is a CSS issue, not really related to jQuery.
Do something like this in your CSS file:
/* Forcing the ul to take not of its floated children. */
#tabs ul { display: inline-block; overflow: hidden; }
#tabs ul { display: block; }
/* Floating the children */
#tabs li { float: left; }
2009/11/12 AdyLim lim...@gmail.com:
Hi there,
I'm just starting to learn jquery and trying to implement tabs onto my
aspx page...The problem is that the tabs are showing up one on top of
anotherhow do i get the tabs to line up in a row? I'm using
jquery 1.2.6...all the js's (ui.core.js, ui.tabs.js) are included in
my masterpage.
any help is appreciated!
thanks!
my code follows:
ASPX:
%@ Page Title= Language=C# MasterPageFile=~/Master.Master
AutoEventWireup=true CodeBehind=WebForm1.aspx.cs
Inherits=ctc3.test.WebForm1 %
asp:Content ID=Content1 ContentPlaceHolderID=head runat=server
/asp:Content
asp:Content ID=Content2 ContentPlaceHolderID=phEmailGoalsheet
runat=server
/asp:Content
asp:Content ID=Content3 ContentPlaceHolderID=ContentPlaceHolder1
runat=server
script type=text/javascript
$(function() {
$(#tabs).tabs();
});
/script
div id=tabs class=ui-tabs-nav
ul
lia href=#tabs-1Nunc tincidunt/a/li
lia href=#tabs-2Proin dolor/a/li
lia href=#tabs-3Aenean lacinia/a/li
/ul
div id=tabs-1
pProin elit arcu, rutrum commodo, vehicula tempus, commodo
a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.
Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem.
Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo.
Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam
sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat.
Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci
tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus./p
/div
div id=tabs-2
pMorbi tincidunt, dui sit amet facilisis feugiat, odio
metus
gravida ante, ut pharetra massa metus id nunc. Duis scelerisque
molestie turpis. Sed fringilla, massa eget luctus malesuada, metus
eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet
fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam.
Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis.
Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra
nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas
feugiat, tellus pellentesque pretium posuere, felis lorem euismod
felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et
purus./p
/div
div id=tabs-3
pMauris eleifend est et turpis. Duis id erat.
Suspendisse potenti.
Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat,
eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent
taciti sociosqu ad litora torquent per conubia nostra, per inceptos
himenaeos. Fusce sodales. Quisque eu urna vel enim commodo
pellentesque. Praesent eu risus hendrerit ligula tempus pretium.
Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus./p
pDuis cursus. Maecenas ligula eros, blandit nec,
pharetra at,
semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra
justo vitae neque. Praesent blandit adipiscing velit. Suspendisse
potenti. Donec mattis, pede vel pharetra blandit, magna ligula
faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque.
Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi
lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean
vehicula velit eu tellus interdum rutrum. Maecenas commodo.
Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus
hendrerit hendrerit./p
/div
/div
!-- End demo --
/asp:Content
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
Re: [jQuery] Re: button value change
iam not sure with this .. but its working... a lil modification..
html
head
titleTest Page/title
script src='jquery.js' type='text/javascript'/script
script type=text/javascript
$(function() {
$('#but').toggle(
function(event) {
$(this).val('Hide Details');
},
function(event) {
$(this).val( 'More Details');
}
);
});
/script
/head
body
input type=button id='but' value=More Details /
/body
/html
thanks
saxan Rappai
On Thu, Nov 12, 2009 at 8:00 PM, David pr davidpric...@gmail.com wrote:
Thanks but this won't work for a input type=button .../ ?
David
--
Thanks regards
Saxan Rappai.
http://www.primemoveindia.com/in_IT_4.html
Re: [jQuery] Re: button value change
Certainly more concise!
On Thu, Nov 12, 2009 at 10:00 AM, saxan rappai saxanrap...@gmail.comwrote:
iam not sure with this .. but its working... a lil modification..
html
head
titleTest Page/title
script src='jquery.js' type='text/javascript'/script
script type=text/javascript
$(function() {
$('#but').toggle(
function(event) {
$(this).val('Hide Details');
},
function(event) {
$(this).val( 'More Details');
}
);
});
/script
/head
body
input type=button id='but' value=More Details /
/body
/html
thanks
saxan Rappai
On Thu, Nov 12, 2009 at 8:00 PM, David pr davidpric...@gmail.com wrote:
Thanks but this won't work for a input type=button .../ ?
David
--
Thanks regards
Saxan Rappai.
http://www.primemoveindia.com/in_IT_4.html
Re: [jQuery] jquery tabs not on the same row! help please!
Floats are a pain as soon as you try to use proper positionning (relative /
absolute) along with proper overflow.
Floats should be used to place content alongside inline content to make said
content flow around the floating element, adapting to its shape. It's
perfect for, say, inserting a visual illustration within the paragraph it
illustrates, and can be used in various hacks to keep a text-free zone to
dress an element around some background-image decoration.
What it shouldn't be used for however is replacing inline-block, because
contrary to inline-blocks, floating elements aren't placed inside the inline
flow but in the twilight-zone-ish floating flow. This means floating
elements won't behave like real blocks nor real inline. For exemple they
won't be taken in account by their block parent when it comes to deciding
it's size, or for overflow (which causes various *nasty* I scroll the div
but the flows don't move or why the fuzz aren't they wrapping bugs in
various implementations of IE), and positioning elements inside can be a
pain (try it, you probably won't like it).
On the other hand, inline-block is exactly the way an img/ behaves plus
the advantages of proper positionning and reserving space as one should, and
as far as IE is concerned it works great using a little initial and
non-intrusive hack to make it IE7 compliant (I'm not too sure about IE6, but
hey, it's already officially made obsolete by its maker...). Plus it's the
standard way to do things, so sooner or later IE will make a gre... a goo...
a job of it.
Hope it helps.
Michel Belleville
2009/11/12 Andrei Eftimie k3liu...@gmail.com
Sorry for thread-hijacking, but why would you say that floats are
complicated?
Right now (as in current browser implementations) floats work really
reliably.
(with 1 small IE bug with an easy fix)
inline-block needs to be hacked in multiple browsers
2009/11/12 Michel Belleville michel.bellevi...@gmail.com:
Also, you'd better not use floating positioning (easier on the very short
term, a lot more complicated in mid-long term).
Michel Belleville
2009/11/12 Andrei Eftimie k3liu...@gmail.com
This is a CSS issue, not really related to jQuery.
Do something like this in your CSS file:
/* Forcing the ul to take not of its floated children. */
#tabs ul { display: inline-block; overflow: hidden; }
#tabs ul { display: block; }
/* Floating the children */
#tabs li { float: left; }
2009/11/12 AdyLim lim...@gmail.com:
Hi there,
I'm just starting to learn jquery and trying to implement tabs onto my
aspx page...The problem is that the tabs are showing up one on top of
anotherhow do i get the tabs to line up in a row? I'm using
jquery 1.2.6...all the js's (ui.core.js, ui.tabs.js) are included in
my masterpage.
any help is appreciated!
thanks!
my code follows:
ASPX:
%@ Page Title= Language=C# MasterPageFile=~/Master.Master
AutoEventWireup=true CodeBehind=WebForm1.aspx.cs
Inherits=ctc3.test.WebForm1 %
asp:Content ID=Content1 ContentPlaceHolderID=head runat=server
/asp:Content
asp:Content ID=Content2 ContentPlaceHolderID=phEmailGoalsheet
runat=server
/asp:Content
asp:Content ID=Content3 ContentPlaceHolderID=ContentPlaceHolder1
runat=server
script type=text/javascript
$(function() {
$(#tabs).tabs();
});
/script
div id=tabs class=ui-tabs-nav
ul
lia href=#tabs-1Nunc tincidunt/a/li
lia href=#tabs-2Proin dolor/a/li
lia href=#tabs-3Aenean lacinia/a/li
/ul
div id=tabs-1
pProin elit arcu, rutrum commodo, vehicula tempus, commodo
a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris.
Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem.
Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo.
Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam
sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat.
Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci
tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus./p
/div
div id=tabs-2
pMorbi tincidunt, dui sit amet facilisis feugiat,
odio
metus
gravida ante, ut pharetra massa metus id nunc. Duis scelerisque
molestie turpis. Sed fringilla, massa eget luctus malesuada, metus
eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet
fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam.
Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis.
Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra
nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas
feugiat, tellus pellentesque pretium posuere, felis lorem euismod
felis, eu ornare leo nisi vel felis.
[jQuery] Issues with jQuery plugins
Hello all... I am working on a php website, and I am using jquery and some
plugins I use on all my websites...
The problem is that I am doing exactly the same thing I do in every website,
but it suddenlly stopped working on this one...
The jquery works fine, I tried a command, the problem is with the plugins...
When I call a plugin, no matter which one,
an error message always says that the function doesn't exists... But the
same code on other website seems to work just
fine... here are a sample of my codes:
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.1//EN
http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=utf-8 /
title:: ::/title
link href=?php echo base_url(); ?css/style.css rel=stylesheet
type=text/css /
link href=?php echo base_url(); ?css/layout.css rel=stylesheet
type=text/css /
link href=?php echo base_url(); ?css/thickbox.css rel=stylesheet
type=text/css /
link href=?php echo base_url(); ?css/jquery.tooltip.css
rel=stylesheet type=text/css /
script language=javaScript type=text/javaScript
window.section = '?php echo $id; ?';
/script
script language=javascript type=text/javascript src=?php echo
base_url(); ?js/jquery.js/script
script language=javascript type=text/javascript src=?php echo
base_url(); ?js/status.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery.editable-1.3.3.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/thickbox.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery-ui-1.7.1.custom.min.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery.tooltip.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery.bgiframe.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery.delegate.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery.dimensions.js/script
script language=javaScript type=text/javaScript
var success = true;
$(document).ready(function() {
$('#sortable').sortable({
'opacity': 0.7,
'revert': true,
'scroll': true,
'handle': $(.imagecontainer).add(.imagecontainer a img),
'update': 'updated'
});
$('#sortable').disableSelection();
$('.thumb').tooltip({
delay: 3,
showURL: false,
bodyHandler: function() {
return $(img/).attr(src, this.src);
}
});
});
Then I get an error message saying that sortable is not a function If
I remove this code, then it would say disableSelection is not a function,
and tooltip is not a function, after that...
Does anyone here might know what's going on? I can't think of anything
else =/
Att.
Paulo Henrique Vieira Neves
Bsc. Sistemas de Informação
+55 38 9141 5400
MSN: paulode...@live.com
GTALK: paulode...@gmail.com
SKYPE: paulodemoc
Re: [jQuery] Issues with jQuery plugins
Sounds like the includes aren't working, maybe base_url() returns the wrong
value. Do a View Source to see how the URLs of those script tags look like.
Or use Firebug's Net panel to check that there are no 404s.
Jörn
On Thu, Nov 12, 2009 at 4:50 PM, Paulo Henrique paulode...@gmail.comwrote:
Hello all... I am working on a php website, and I am using jquery and some
plugins I use on all my websites...
The problem is that I am doing exactly the same thing I do in every
website, but it suddenlly stopped working on this one...
The jquery works fine, I tried a command, the problem is with the
plugins... When I call a plugin, no matter which one,
an error message always says that the function doesn't exists... But the
same code on other website seems to work just
fine... here are a sample of my codes:
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.1//EN
http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=utf-8 /
title:: ::/title
link href=?php echo base_url(); ?css/style.css rel=stylesheet
type=text/css /
link href=?php echo base_url(); ?css/layout.css rel=stylesheet
type=text/css /
link href=?php echo base_url(); ?css/thickbox.css rel=stylesheet
type=text/css /
link href=?php echo base_url(); ?css/jquery.tooltip.css
rel=stylesheet type=text/css /
script language=javaScript type=text/javaScript
window.section = '?php echo $id; ?';
/script
script language=javascript type=text/javascript src=?php echo
base_url(); ?js/jquery.js/script
script language=javascript type=text/javascript src=?php echo
base_url(); ?js/status.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery.editable-1.3.3.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/thickbox.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery-ui-1.7.1.custom.min.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery.tooltip.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery.bgiframe.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery.delegate.js/script
script language=javascript type=text/javascript src=?php echo
base_url();?js/jquery.dimensions.js/script
script language=javaScript type=text/javaScript
var success = true;
$(document).ready(function() {
$('#sortable').sortable({
'opacity': 0.7,
'revert': true,
'scroll': true,
'handle': $(.imagecontainer).add(.imagecontainer a img),
'update': 'updated'
});
$('#sortable').disableSelection();
$('.thumb').tooltip({
delay: 3,
showURL: false,
bodyHandler: function() {
return $(img/).attr(src, this.src);
}
});
});
Then I get an error message saying that sortable is not a function If
I remove this code, then it would say disableSelection is not a function,
and tooltip is not a function, after that...
Does anyone here might know what's going on? I can't think of anything
else =/
Att.
Paulo Henrique Vieira Neves
Bsc. Sistemas de Informação
+55 38 9141 5400
MSN: paulode...@live.com
GTALK: paulode...@gmail.com
SKYPE: paulodemoc
[jQuery] Jquery Tabs
I'm having an issue, which seems common, when loading tab content using the Jquery Tab plugin. It seems the content loads on the page prior to being tabbed. This causes the page to jump around for a split second before the content loads completely. Is there any way of fixing this issue? http://docs.jquery.com/UI/Tabs Thanks!
[jQuery] Getting a position and setting a absolute position relatively
I want to find the x,y position of an element on the page and then set the xy position of another element relative to the first one. How do I do this?
Re: [jQuery] Getting a position and setting a absolute position relatively
http://docs.jquery.com/CSS/offset http://docs.jquery.com/CSS/css#namevalue Michel Belleville 2009/11/12 Atkinson, Sarah sarah.atkin...@cookmedical.com I want to find the x,y position of an element on the page and then set the xy position of another element relative to the first one. How do I do this?
[jQuery] Re: SimpleModal issues when loading content via Ajax
I determined what was the issued and will post my solution here in
case others encounter the same problem.
I incorrectly assumed the .load() call was a synchronous (blocking)
call, which it is not. Therefore, the SimpleModal call was processing
the empty div before the content had finished being served.
I updated the code to use a callback function to display the modal
dialog and everything now works correctly:
$(#dialog).load(/snippet.html, {}, function()
{
$(#dialog).modal({
overlay:80,
overlayCss: {backgroundColor:#000}
});
});
[jQuery] Re: better way to access JSON than with $.getJSON on each button press
Thanks Scott...you have given me some food for thought.
On Nov 12, 9:18 am, Scott Sauyet scott.sau...@gmail.com wrote:
function getData(url) {
var storedData;
return function(callback) {
if (storedData) callback(storedData)
else $.getJSON(url, function(data) {
storedData = data;
callback(storedData);
});
};
};
That has the disadvantage that is will make the AJAX call multiple
times if multiple calls come in to the generated function before the
first one completes. This has the same API, but is cleaner:
function getData(url) {
var storedData, callbacks = [];
$.getJSON(url, function(data) {
storedData = data;
for (var i = 0; i callbacks.length; i++) {
callbacks[i](data);
}
});
return function(callback) {
if (storedData) callback(storedData)
else callbacks.push(callback);
};
};
This could easily be extended for multiple re-tries on ajax failure.
But any of these techniques turn what you would like to think of as
synchronous calls into asynchronous ones. A different technique
avoids making you think about this, although it is equally
asynchronous: Simply move your click binding inside the
initial .getJSON callback. data will be available, and you won't
have to make additional calls. The biggest disadvantage of this is
that the default action will happen on your links if they're clicked
before the ajax call returns.
Anyway, here's a few ideas.
-- Scott
[jQuery] Re: better way to access JSON than with $.getJSON on each button press
Thanks Scott...you have given me some food for thought.
On Nov 12, 9:18 am, Scott Sauyet scott.sau...@gmail.com wrote:
function getData(url) {
var storedData;
return function(callback) {
if (storedData) callback(storedData)
else $.getJSON(url, function(data) {
storedData = data;
callback(storedData);
});
};
};
That has the disadvantage that is will make the AJAX call multiple
times if multiple calls come in to the generated function before the
first one completes. This has the same API, but is cleaner:
function getData(url) {
var storedData, callbacks = [];
$.getJSON(url, function(data) {
storedData = data;
for (var i = 0; i callbacks.length; i++) {
callbacks[i](data);
}
});
return function(callback) {
if (storedData) callback(storedData)
else callbacks.push(callback);
};
};
This could easily be extended for multiple re-tries on ajax failure.
But any of these techniques turn what you would like to think of as
synchronous calls into asynchronous ones. A different technique
avoids making you think about this, although it is equally
asynchronous: Simply move your click binding inside the
initial .getJSON callback. data will be available, and you won't
have to make additional calls. The biggest disadvantage of this is
that the default action will happen on your links if they're clicked
before the ajax call returns.
Anyway, here's a few ideas.
-- Scott
[jQuery] Re: better way to access JSON than with $.getJSON on each button press
function getData(url) {
var storedData;
return function(callback) {
if (storedData) callback(storedData)
else $.getJSON(url, function(data) {
storedData = data;
callback(storedData);
});
};
};
That has the disadvantage that is will make the AJAX call multiple
times if multiple calls come in to the generated function before the
first one completes. This has the same API, but is cleaner:
function getData(url) {
var storedData, callbacks = [];
$.getJSON(url, function(data) {
storedData = data;
for (var i = 0; i callbacks.length; i++) {
callbacks[i](data);
}
});
return function(callback) {
if (storedData) callback(storedData)
else callbacks.push(callback);
};
};
This could easily be extended for multiple re-tries on ajax failure.
But any of these techniques turn what you would like to think of as
synchronous calls into asynchronous ones. A different technique
avoids making you think about this, although it is equally
asynchronous: Simply move your click binding inside the
initial .getJSON callback. data will be available, and you won't
have to make additional calls. The biggest disadvantage of this is
that the default action will happen on your links if they're clicked
before the ajax call returns.
Anyway, here's a few ideas.
-- Scott
[jQuery] AJAX call returns as error when no error
I don't know if anyone else has seen this. But if anyone has and
knows a fix for it it would be great.
I am using the jquery ajax library to do a timed update (once per
minute). I am using POST against and asmx web service.
Intermittently jquery will return an error with the requested data as
the return text and an HTTP state of 200. Below is the code for the
ajax call.
Thanks in advance for any responses.
Below, ajax call will hit the error callback, xhr parameter will have
an http state of 200 and xhr.ResponseText.d will be the requested
data.
var WebClient = {
ServiceURI: /WebService.asmx,
Timeout: 1
}
WebClient.initialize = function() {
$.ajaxSetup({
contentType: application/json; charset=utf-8,
dataType: json,
timeout: WebClient.Timeout
});
}
WebClient.ajaxCall = function(uri, type, data, callbackSuccess,
callbackError, callId) {
$.ajax({
url: uri,
type: type,
data: data,
cache: false,
success: function(msg) {
if (callbackSuccess) {
if (callId) {
callbackSuccess(msg, callId);
}
else {
callbackSuccess(msg);
}
}
},
error: function(xhr) {
if (callbackError) {
if (callId) {
callbackError(xhr, callId);
}
else {
callbackError(xhr);
}
}
else if (xhr.responseText) {
alert(xhr.responseText);
}
else {
alert(Unknown Server Error.);
}
}
});
}
WebClient.query = function(data, callbackSuccess, callbackError,
callId) {
var json = $.toJSON(data);
var uri = WebClient.ServiceURI + /QueryV2_Json;
WebClient.ajaxCall(uri, POST, json, callbackSuccess, callbackError,
callId);
}
[jQuery] jQuery not obeying my css? or applying its own during effect?
I have some image/text animation here http://www.smithsgardentown.com/ The big promo below the nav fades in and out. However, during the effect it appears on top of my sidebar div and after the effect I guess applies my css and drops behind it. I would like for the entire effect to take place behind that div. Is jQuery applying its own css or for some reason ignoring mine? Any help would be great.
[jQuery] error when using a timeout
I'm using this plugin to animate some background images:
http://plugins.jquery.com/project/backgroundPosition-Effect
Now it works fine until I wrap the animate function in a timer. Then
it gives me errors. I'm changing the image on hover. Here's my code:
var hideDelay = 2000;
var hideDelayTimer = null;
$(.tab_item).mouseover(function() {
if (hideDelayTimer) clearTimeout(hideDelayTimer);
$(this).animate({
backgroundPosition: '(0 100px)'
});
}).mouseout(function(){
if (hideDelayTimer) clearTimeout(hideDelayTimer);
hideDelayTimer = setTimeout(function () {
$(this).animate({backgroundPosition: '(0 0)'});
hideDelayTimer = null;
}, hideDelay);
});
Any ideas why it wouldn't fire like this? Here's the error message:
uncaught exception: [Exception... Could not convert JavaScript
argument arg 0 nsresult: 0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)
location: JS frame ::
http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js
:: anonymous :: line 12 data: no]
[jQuery] JQuery - Feedback tab
Hey All, I am just working on a site with an associate which is a jQuery driven feedback tab. Which uses a javascript mvc style model and AJAX / jsonp communication, to communicate to a asp.net modified web services. I would love to get some feedback about the tab www.monyta.com, and any ideas suggestions about how to improve it! At the moment, to run the feedback tab you need to create an account and copy and paste a small amount of javascript, which dynamically loads jQuery. Would this be the prefered method, or should I offer a jQuery plugin as an option? Thanks Scott
[jQuery] autocomplete div don't disappear after move scroll
try in http://www.confestetica.it/estetica/ (on the right) 1. typed some chars 2. move scrollbar with mouse 3. click elsewhere 4. div do not disappear as expected (at least by me) I loaded bgiframe plugin, there is something I have to do to make it behave as I expect? Daniele.
[jQuery] (validation) jQuery validation plugin and FormWizard
Hi All! I have a really, really long form (about 300 fields) that I broke down into different sections using this slick a href=http:// www.jankoatwarpspeed.com/post/2009/09/28/webform-wizard-jquery.aspxjQuery plugin Form Wizard/a. If you group your form into different fieldsets, the FormWizard will automagically display one section at a time, with a Next hyperlink to take you to the next section with codea id=step0Next class=next href=#Next /a/code My question is this: Using the jQuery Validation plugin, how can I validate each fieldset when a user clicks Next, and so forth, instead of using the Submit button - how can I validate the form in steps rather than all at once? Put differently, how can I change the trigger event from Submit to six different hyperlinks for six separate sections? Thanks for helping this newb out.
[jQuery] Get paste event text.
Hi all,
How can I get the text from the clipboard when user is about to paste.
For example, if user has copied the text Jquery forum, I should get this
text from
the paste event.
I tried to use
$(#test).bind('paste', function(e) {
alert(e.clipboardData.getData(Text));
});
but I do not get anything.
Can anybody give me any ideas??
Thanks,
Sincerely,
Sonal.
--
View this message in context:
http://old.nabble.com/Get-paste-event-text.-tp26322586s27240p26322586.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Defaults one page have to enable
when i using jquery.history_remote.js working good... but i need a help for it, when landing to the page one remote file should enable, but i can't any one can?
[jQuery] IE radio button show nothing after click or change
In IE7 my radio button do not display 'checked' when I click on it.
(ie I would not change to show which button has been clicked)
I work fine in Firefox. Need Help. Thanks in advance.
I am using jquery-1.3.2.min.js and the following work fine as well.
$(input[name='radioname']).click(function() {
alert ( $(input[name='radioname']:checked).val() );
});
$(input[name='radioname']).change(function() {
alert ( $(input[name='radioname']:checked).val() );
});
[jQuery] Re: Jquery Tabs
Issue Resolved. I stopped using the Jquery Tabs and started using http://flowplayer.org/tools/demos/tabs/index.html On Nov 12, 11:06 am, StephenJacob turnstylecreat...@gmail.com wrote: I'm having an issue, which seems common, when loading tab content using the Jquery Tab plugin. It seems the content loads on the page prior to being tabbed. This causes the page to jump around for a split second before the content loads completely. Is there any way of fixing this issue? http://docs.jquery.com/UI/Tabs Thanks!
[jQuery] Re: Cluetip not working in Chrome 3.0.195
Karl, I see thanks for pointing that out. My bad. You were right it is working now. On Nov 11, 9:20 am, dondmcg d...@mcgrathdesigns.com wrote: Thecluetipdisplays wonderfully in all browsers I have tested exceptChromever. 3.0.195. The problem is that the first instance appears but subsequent instance willnotdisplay. Here is a link:http://conted.nybg.org:8080/WebModule/jsp/datafeedplugin.jsp?df1=layo... If the above link breaks to another line be sure to paste in the full path. We have the page displaying output from a database right now but when it was still in a test environment just hard coded with data thecluetipdidnotdisplay, so the issue isnotwith implementation with regard to the database. Any help or suggestions would be greatly appreciated, we love thecluetip.
[jQuery] jQuery cycle plugin
I've been using the jquery cycle plugin (http://malsup.com/jquery/
cycle) and it's doing exactly as I want except that it doesn't seem to
recognise the first slide as slide one. I'm using the onAfter function
to to turn the next/prev links on and off as appropriate and to
display page 1 of ? but the next link persists on its own on page 2
(when you would expect the prev link to have appeared) and, although
the pages are counted correctly, page 2 shows up as page 1 of 7 same
as the real page one). You can see what I mean at:
http://www.nottingham.ac.uk/~ttzelrn/ma-tesol/module1/unit1/index.php
The structure of divs is quite involved but I think it's sound and, as
I say, the plugin is counting the divs ok.
Code below:
$(document).ready(function() {
$('#cycle-content').cycle({
fx: 'none',
prev: '#prev',
next: '#next',
after: onAfter,
timeout: 0
});
function onAfter(curr, next, opts) {
var index = opts.currSlide;
$('#prev')[index == 0 ? 'hide' : 'show']();
$('#next')[index == opts.slideCount - 1 ? 'hide' : 'show']();
var caption = 'Page ' + (opts.currSlide + 1) + ' of ' +
opts.slideCount;
$('#caption').html(caption);
}
});
I'd be really grateful for any help with this.
Matthew
[jQuery] jQuery Pagination - Return to top of screen
jQuery Pagination works great, but when you click for the next set of
results the window does not return to the top (if you have to scroll
to get to the pagination). would anyone have any ideas on how to force
the window scroll back to the top on click?
-
function pageselectCallback(page_index, jq){
var new_content = $('#hiddenresult div.result:eq('+page_index
+')').clone();
$('#Searchresult').empty().append(new_content);
return false;
}
function initPagination() {
var num_entries = $('#hiddenresult div.result').length;
// Create pagination element
$(#Pagination).pagination(num_entries, {
num_edge_entries: 10,
num_display_entries: 8,
callback: pageselectCallback,
items_per_page:1
});
}
// Load HTML snippet with AJAX and insert it into the Hiddenresult
element
// When the HTML has loaded, call initPagination to paginate the
elements
$(document).ready(function(){
initPagination();
});
[jQuery] Re: Instantiating a chart in a dynamically-added div
It's probably not a good idea to make the user's browser hang while
you wait for a response from the server.
Have you tried something like this?
$(#summDiv).load(/your/url, {ASXCode:z}, function
(responseText, textStatus) {
// might want to check textStatus here.
doTheChart();
doTheRest(z);
});
Look at the callback parameter here for more info:
http://docs.jquery.com/Ajax/load#urldatacallback
Cheers,
-- Scott
Re: [jQuery] jquery tabs not on the same row! help please!
You have a lot of you facts wrong.
Floats are a pain as soon as you try to use proper positionning (relative /
absolute) along with proper overflow.
Nope, they are not. Floats do not have any effect on positioning.
Positioning works the way it should around and inside floats.
(Except for a weird IE bug, where sometimes a floated element sibling
to a absolutely positioned element will make one of them disappear. If
I remember correctly the absolutely positioned one. The fix is to ad
another neutral element between them, lets say, wrap the positioned
element with a div)
Floats should be used to place content alongside inline content to make said
content flow around the floating element, adapting to its shape. It's
perfect for, say, inserting a visual illustration within the paragraph it
illustrates,
I wholeheartedly agree with you here
and can be used in various hacks to keep a text-free zone to
dress an element around some background-image decoration.
Lets say ok... though I'm not sure what you mean by this.
What it shouldn't be used for however is replacing inline-block, because
contrary to inline-blocks, floating elements aren't placed inside the inline
flow but in the twilight-zone-ish floating flow.
Yes, flow doesn not replace inline-block, and float does not want to do that.
Yes, they are not in the normal flow, be it inline or block. Its not a
twilightish area.
They are in a... lets call it float flow.
This means floating
elements won't behave like real blocks nor real inline. For exemple they
won't be taken in account by their block parent when it comes to deciding
it's size, or for overflow (which causes various *nasty* I scroll the div
but the flows don't move or why the fuzz aren't they wrapping bugs in
various implementations of IE),
This is how you can force an element to take its flowed children into
consideration regarding their size:
1. If the parent is a float, it worked as expected.
2. If the parent is a block, you need to do the following:
a) Force the element to calculate its boundaries (by declaring an
overflow value usually) or (proffered)
b) Use a clearer and
c) Enable hasLayout of IE
Example code:
HTML
div class=block
div class=float/div
/div
CSS
.block { display: inline-block; overflow: hidden; }
.block { display: block; }
**
Of overflow doesn't work with the current Layout you are building, change it to:
CSS:
.block:after { content: '.'; display: block; clear: both; height: 0;
visibility: hidden; }
**
Setting the display property to inline-block enables hasLayout for IE,
then we can change it back on the following declaration.
Note. You can not reset it in the same declaration. It wont work.
And yes, we could use height or width or any other property that
activates hasLayout. I like this method because it won't force me to
use IE proprietary code and it doesn't scar my CSS code (by that I
mean setting a height or width when I do not want one. You can reset
the display property to whatever you need, and the hasLayout remains
active
and positioning elements inside can be a
pain (try it, you probably won't like it).
It works like a charm. Please give an example, and I'll show you where
you made a mistake.
On the other hand, inline-block is exactly the way an img/ behaves plus
the advantages of proper positionning and reserving space as one should, and
as far as IE is concerned it works great using a little initial and
non-intrusive hack to make it IE7 compliant (I'm not too sure about IE6, but
hey, it's already officially made obsolete by its maker...).
Glad to hear that you can afford to dodge IE6 so soon. The vast
majority of us still need to support it. And probably will need to for
a few more years. Probably around 3-5, depending on the scope of the
projects at hand.
Plus it's the
standard way to do things, so sooner or later IE will make a gre... a goo...
a job of it.
Here is what you have got it the most wrong. Floats are NOT designed
for Layouts, and inline-block is NOT designed for Layouts.
For real Layouting we need to wait for the CSS3 Layout module.
See http://www.w3.org/TR/2009/WD-css3-layout-20090402/ and
http://www.css3.info/introducing-the-flexible-box-layout-module/ for
some ideas and implementations.
Hope it helps.
Right now, floats and positioning are the best tools we have for
layouting. I'm not sure that inline-block can do a better job. It
might work good. I'm curious about the price tough.
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
Re: [jQuery] jQuery Pagination - Return to top of screen
would anyone have any ideas on how to force
the window scroll back to the top on click?
function pageselectCallback(page_index, jq){
var new_content = $('#hiddenresult
div.result:eq('+page_index+')').clone();
$('#Searchresult').empty().append(new_content);
window.scroll(0,0);
return false;
}
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
Re: [jQuery] IE radio button show nothing after click or change
I'm not sure about this right now, but from memory, IE will change the
value after the element has loses its focus.
On Thu, Nov 12, 2009 at 7:54 PM, 2daughtersdad jacob@gmail.com wrote:
In IE7 my radio button do not display 'checked' when I click on it.
(ie I would not change to show which button has been clicked)
I work fine in Firefox. Need Help. Thanks in advance.
I am using jquery-1.3.2.min.js and the following work fine as well.
$(input[name='radioname']).click(function() {
alert ( $(input[name='radioname']:checked).val() );
});
$(input[name='radioname']).change(function() {
alert ( $(input[name='radioname']:checked).val() );
});
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
Re: [jQuery] Get paste event text.
You do not have access to the clipboard.
(Only IE provides some mechanism for it)
And from what I remember there might be some implementations for other
browsers. I think using flash. But they're very hackish.
On Thu, Nov 12, 2009 at 7:14 PM, sonal.breed sonal.br...@gmail.com wrote:
Hi all,
How can I get the text from the clipboard when user is about to paste.
For example, if user has copied the text Jquery forum, I should get this
text from
the paste event.
I tried to use
$(#test).bind('paste', function(e) {
alert(e.clipboardData.getData(Text));
});
but I do not get anything.
Can anybody give me any ideas??
Thanks,
Sincerely,
Sonal.
--
View this message in context:
http://old.nabble.com/Get-paste-event-text.-tp26322586s27240p26322586.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
Re: [jQuery] autocomplete div don't disappear after move scroll
Works fine in FF 3.5.5 On Thu, Nov 12, 2009 at 6:36 PM, danielecr daniele...@gmail.com wrote: try in http://www.confestetica.it/estetica/ (on the right) 1. typed some chars 2. move scrollbar with mouse 3. click elsewhere 4. div do not disappear as expected (at least by me) I loaded bgiframe plugin, there is something I have to do to make it behave as I expect? Daniele. -- Andrei Eftimie http://eftimie.com +40 758 833 281 Punct http://designpunct.ro
Re: [jQuery] jQuery not obeying my css? or applying its own during effect?
Congrats on having courage to go with HTML 5. Add *position: relative;* to your *aside* element. And it should be fixed. On Thu, Nov 12, 2009 at 4:57 PM, James Fleeting twofivethree...@gmail.com wrote: I have some image/text animation here http://www.smithsgardentown.com/ The big promo below the nav fades in and out. However, during the effect it appears on top of my sidebar div and after the effect I guess applies my css and drops behind it. I would like for the entire effect to take place behind that div. Is jQuery applying its own css or for some reason ignoring mine? Any help would be great. -- Andrei Eftimie http://eftimie.com +40 758 833 281 Punct http://designpunct.ro
Re: [jQuery] error when using a timeout
hideDelayTimer = setTimeout(function () {
$(this).animate({backgroundPosition: '(0 0)'});
hideDelayTimer = null;
}, hideDelay);
$(this) might not refer to anything in this context. setTimeout works
in the global scope, so the reference to the object you want animated
is lost.
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
[jQuery] CSSIE = jQuery plugin to fix IE's CSS
Plugin for jQuery providing native support for missing CSS in IE. Currently provides: * E F (direct descendant) * :hover (normally only available to a tags) * E + F (sibling) * [rel=attr] (attribute selection) * :first-child and any other selectors containing : and supported by jQuery * :focus * plus others blog post = http://blog.parkerfox.co.uk/2009/11/12/css-in-your-face-only-ie-need-to-apply/ source = http://github.com/weepy/cssie
Re: [jQuery] Superfish - Auto Arrows on sub menus only?
Anyone know of a quick way to apply auto arrows to ONLY the sub menus,
while leaving the top-level list items sans-arrow?
I'm not what kind of arrows you would need, but I suppose you are able
to add them via CSS.
(And yes, this isn't really jQuery related. This is a CSS issue)
For a HTML like this:
ul id=nav
li
a href=#Item 1/a
ul
lia href=#Sub Item 1/a/li
lia href=#Sub Item 2/a/li
lia href=#Sub Item 3/a/li
/ul
...
/ul
CSS
#nav li li { background: url(arrow.gif) no-repeat 0 50%; padding-left: 10px; }
Using CSS descendant selectors you can style only the grand children
list-elements of the list.
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
Re: [jQuery] CSSIE = jQuery plugin to fix IE's CSS
Cool. So we'd only need to use these selectors in an external CSS file, and it should work? I'm usually adding manually some extra classes for IE6 for these kind of things (when they cannot be avoided at all). So I am making sure that it applies only to the elements I need fixing. Is the performance hit big? (I'm guessing it takes some cpu time to parse all style sheets for some selectors, add classes and events, and new CSS rules (with the new classes) On Thu, Nov 12, 2009 at 11:54 PM, weepy jonah...@gmail.com wrote: Plugin for jQuery providing native support for missing CSS in IE. Currently provides: * E F (direct descendant) * :hover (normally only available to a tags) * E + F (sibling) * [rel=attr] (attribute selection) * :first-child and any other selectors containing : and supported by jQuery * :focus * plus others blog post = http://blog.parkerfox.co.uk/2009/11/12/css-in-your-face-only-ie-need-to-apply/ source = http://github.com/weepy/cssie -- Andrei Eftimie http://eftimie.com +40 758 833 281 Punct http://designpunct.ro
[jQuery] Contact Form not working
Hey just a quick question here, i have a contact form that i got from some random forum i googled, and find this nice contact form made from jquery the author said u only need to change a few things to make it work: the email addres which will accept the mail and the css style i also read some of the users that allready use that contact forms and all of them seems pleased (it work) but when i download and try it, it keep giving me error message when i try to send it so if can anyone help me here to see through the files what might cause the problem? edit it and post back to me, also please post which line of the script that gives the error thx the files: http://rapidshare.com/files/306073599/contactsap.zip
Re: [jQuery] (validation) Validation plugin submitHandler
Use a different name for the submit-button. Using name=submit you override
the actual submit-function of the form. Keep in mind that in the DOM API,
you can access any form element as a property of the form, referenced by
name.
Jörn
On Thu, Nov 12, 2009 at 8:48 PM, mcrawford mcrawf...@gmail.com wrote:
I'm totally stumped with the submitHandler. Here is my test page, down
below. I'm using PHP just to print out the form variables but
obviously you could adapt the HTML for anything.
Notice that I have set my Submit button to have name=submit which
means that, in the submitHandler, form.submit() is not a function. I
get a JavaScript error on that line, but (and this is what I can't
figure out), the form still submits.
I can change the Submit button to have a different name, like
name=sbmt. That avoids the JS error on the form.submit() line. But
then (and I don't get this either), if you click the Cancel button,
that value of cancel=Cancel will not get sent in the post. With the
Submit button named submit the cancel=Cancel gets posted correctly
when you click on that button.
?php
if (!empty($_POST)) {
print_r($_POST);
}
?
html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en
head
titleTEST/title
meta http-equiv=Content-Type content=text/html;
charset=utf-8/
script type=text/javascript
src=/js/jquery-1.3.2.js/script
script type=text/javascript src=/js/jquery-validate/
jquery.validate.js/script
/head
body
form action=test-validate.php method=post
id=the-form
input type=hidden name=hidden
value=something/
input class=button type=submit name=submit
value=Do it
now!/
input class=button cancel type=submit
name=cancel
value=Cancel/
/form
script type=text/javascript
$(function() {
// VALIDATION
$(#the-form).validate({
submitHandler: function(form) {
$('input[name=submit]',
'#the-form').attr('disabled',
'disabled');
form.submit();
}
});
});
/script
/body
/html
[jQuery] Re: Jquery Tabs
After further research it appears they are both doing the same thing when loading content. Does anyone have any suggestions or experience working with things like this? I understand that Jquery can not tabify the content until the page is loaded.. there for, the HTML must load the page and then organize it into the tab system.. There has to be some kind of trick to hide the content until the page or tab system completely loads? Thanks! On Nov 12, 1:56 pm, StephenJacob turnstylecreat...@gmail.com wrote: Issue Resolved. I stopped using the Jquery Tabs and started usinghttp://flowplayer.org/tools/demos/tabs/index.html On Nov 12, 11:06 am, StephenJacob turnstylecreat...@gmail.com wrote: I'm having an issue, which seems common, when loading tab content using the Jquery Tab plugin. It seems the content loads on the page prior to being tabbed. This causes the page to jump around for a split second before the content loads completely. Is there any way of fixing this issue? http://docs.jquery.com/UI/Tabs Thanks!
[jQuery] How to add click() function to a tr during grid loadComplete function.
Hi All,
Hoping someone might be able to help me here,
I'm trying specify a click function to a jqGrid's row during the
loadComplete event but having difficulty 'getting to' the tr element..
What I've been trying is this sort of thing but with no result..
var ids = jQuery(#cell_list).getDataIDs();
/* for each row loaded */
for(var i=0;iids.length;i++){
var row = ids[i];
$(row).children('td').click(function(){
// do something here
})
}
Any advice here greatly appreciated,
Thanks
--
View this message in context:
http://old.nabble.com/How-to-add-click%28%29-function-to-a-tr-during-grid-loadComplete-function.-tp26328069s27240p26328069.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: jQuery Pagination - Return to top of screen
Works great, thank you.
On Nov 12, 4:30 pm, Andrei Eftimie k3liu...@gmail.com wrote:
would anyone have any ideas on how to force
the window scroll back to the top on click?
function pageselectCallback(page_index, jq){
var new_content = $('#hiddenresult
div.result:eq('+page_index+')').clone();
$('#Searchresult').empty().append(new_content);
window.scroll(0,0);
return false;
}
--
Andrei Eftimiehttp://eftimie.com
+40 758 833 281
Puncthttp://designpunct.ro
[jQuery] Re: (validation) Validation plugin submitHandler
Right, thanks. I mentioned that in my initial post.
But if I rename the submit-button, if you click the Cancel button,
that value of cancel=Cancel will not get sent in the post.
Any ideas why?
On Nov 12, 2:05 pm, Jörn Zaefferer joern.zaeffe...@googlemail.com
wrote:
Use a different name for the submit-button. Using name=submit you override
the actual submit-function of the form. Keep in mind that in the DOM API,
you can access any form element as a property of the form, referenced by
name.
Jörn
On Thu, Nov 12, 2009 at 8:48 PM, mcrawford mcrawf...@gmail.com wrote:
I'm totally stumped with the submitHandler. Here is my test page, down
below. I'm using PHP just to print out the form variables but
obviously you could adapt the HTML for anything.
Notice that I have set my Submit button to have name=submit which
means that, in the submitHandler, form.submit() is not a function. I
get a JavaScript error on that line, but (and this is what I can't
figure out), the form still submits.
I can change the Submit button to have a different name, like
name=sbmt. That avoids the JS error on the form.submit() line. But
then (and I don't get this either), if you click the Cancel button,
that value of cancel=Cancel will not get sent in the post. With the
Submit button named submit the cancel=Cancel gets posted correctly
when you click on that button.
?php
if (!empty($_POST)) {
print_r($_POST);
}
?
html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en
head
titleTEST/title
meta http-equiv=Content-Type content=text/html;
charset=utf-8/
script type=text/javascript
src=/js/jquery-1.3.2.js/script
script type=text/javascript src=/js/jquery-validate/
jquery.validate.js/script
/head
body
form action=test-validate.php method=post
id=the-form
input type=hidden name=hidden
value=something/
input class=button type=submit name=submit
value=Do it
now!/
input class=button cancel type=submit
name=cancel
value=Cancel/
/form
script type=text/javascript
$(function() {
// VALIDATION
$(#the-form).validate({
submitHandler: function(form) {
$('input[name=submit]',
'#the-form').attr('disabled',
'disabled');
form.submit();
}
});
});
/script
/body
/html
[jQuery] Re: (validation) Validation plugin submitHandler
Also, that doesn't explain why the form still submits when I call
form.submit(). Since submit is no longer a function, the form should
never get submitted in that case.
On Nov 12, 2:05 pm, Jörn Zaefferer joern.zaeffe...@googlemail.com
wrote:
Use a different name for the submit-button. Using name=submit you override
the actual submit-function of the form. Keep in mind that in the DOM API,
you can access any form element as a property of the form, referenced by
name.
Jörn
On Thu, Nov 12, 2009 at 8:48 PM, mcrawford mcrawf...@gmail.com wrote:
I'm totally stumped with the submitHandler. Here is my test page, down
below. I'm using PHP just to print out the form variables but
obviously you could adapt the HTML for anything.
Notice that I have set my Submit button to have name=submit which
means that, in the submitHandler, form.submit() is not a function. I
get a JavaScript error on that line, but (and this is what I can't
figure out), the form still submits.
I can change the Submit button to have a different name, like
name=sbmt. That avoids the JS error on the form.submit() line. But
then (and I don't get this either), if you click the Cancel button,
that value of cancel=Cancel will not get sent in the post. With the
Submit button named submit the cancel=Cancel gets posted correctly
when you click on that button.
?php
if (!empty($_POST)) {
print_r($_POST);
}
?
html xmlns=http://www.w3.org/1999/xhtml; xml:lang=en lang=en
head
titleTEST/title
meta http-equiv=Content-Type content=text/html;
charset=utf-8/
script type=text/javascript
src=/js/jquery-1.3.2.js/script
script type=text/javascript src=/js/jquery-validate/
jquery.validate.js/script
/head
body
form action=test-validate.php method=post
id=the-form
input type=hidden name=hidden
value=something/
input class=button type=submit name=submit
value=Do it
now!/
input class=button cancel type=submit
name=cancel
value=Cancel/
/form
script type=text/javascript
$(function() {
// VALIDATION
$(#the-form).validate({
submitHandler: function(form) {
$('input[name=submit]',
'#the-form').attr('disabled',
'disabled');
form.submit();
}
});
});
/script
/body
/html
Re: [jQuery] Cluetip: Access both local external content
Just write two separate calls:
$('a.some-class').cluetip({local: true});
$('a.another-class').cluetip();
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 11, 2009, at 2:35 PM, JMD wrote:
What script do I use to have cluetip alternately access local (#divID)
vs. external (external.jsp#divID) content to populate the cluetip? Not
at the same time, just some links are local and some aren't.
I can't seem to create a script that doesn't conflict with one or the
other condition.
For example, this works for external, but not local:
http://www.mail-archive.com/jquery-en@googlegroups.com/msg36931.html
Thanks!
Re: [jQuery] Change style of Div with fade
Jonathan Snook's background animation article might be helpful: http://www.snook.ca/archives/javascript/jquery-bg-image-animations/ --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Nov 12, 2009, at 9:27 AM, Dan wrote: Hi, Can anyone tell me how to rotate the background-color style of a div with a fade? I need it to rotate colors every 10 seconds, having one fade into the next, and will need to have 3 background colors, then keep looping from the first color. My Div is named #rotateBG. Thanks
[jQuery] Re: How can i make a timer that i can stop with jquery?
Not really requiring jQuery, just read up on JavaScript's setInterval, which is like setTimeout except you can cancel it On Nov 12, 7:39 pm, Mark mark...@gmail.com wrote: Hi, i tried this jquery countdown plugin:http://davidwalsh.name/jquery-countdown-pluginand it works neat.. but not for my interest. What i try to do is have this: Have a simple countdown that counts down from 5 to 0 then changes the text to Uploading... The plugin mentioned can do that but i also want to be able to cancel the countdown which it can't do. Can anyone point me to a plugin that does have that functionality? or how i make that in this plugin.. So what i want to be able to do: 5 4 3 2 1 0 Uploading... Or when cancel is pressed 5 4 3 2 CANCEL Just like that. I hope anyone can help me with this. Thanx, Mark.
Re: [jQuery] Re: How can i make a timer that i can stop with jquery?
Now MorningZ, that is possibly the worst comparison of setInterval() and setTimeout() that I've ever seen! (Please take that as a little good-natured ribbing among friends, OK?) Both setInterval() and setTimeout() are cancelable, using clearInterval() and clearTimeout() respectively. The difference between setInterval() and setTimeout() is that setTimeout() calls the callback function only once (or not at all if you cancel it first). setInterval() calls the callback function repeatedly until you cancel it. https://developer.mozilla.org/en/DOM/window.setInterval https://developer.mozilla.org/en/DOM/window.setTimeout You're certainly right on the essential point: a bit of simple code using setInterval() or setTimeout() may well be all that Mark needs. Mark, you may want to look at the source code of that plugin and see where it calls one of these two functions. That will give you some idea of how you could use them in your own code. Also beware: this inside a setInterval() or setTimeout() callback is not what you expect! -Mike On Thu, Nov 12, 2009 at 5:28 PM, MorningZ morni...@gmail.com wrote: Not really requiring jQuery, just read up on JavaScript's setInterval, which is like setTimeout except you can cancel it On Nov 12, 7:39 pm, Mark mark...@gmail.com wrote: Hi, i tried this jquery countdown plugin: http://davidwalsh.name/jquery-countdown-pluginand it works neat.. but not for my interest. What i try to do is have this: Have a simple countdown that counts down from 5 to 0 then changes the text to Uploading... The plugin mentioned can do that but i also want to be able to cancel the countdown which it can't do. Can anyone point me to a plugin that does have that functionality? or how i make that in this plugin.. So what i want to be able to do: 5 4 3 2 1 0 Uploading... Or when cancel is pressed 5 4 3 2 CANCEL Just like that. I hope anyone can help me with this. Thanx, Mark.
[jQuery] Cycle plugin won't start until all images have loaded (IE-only)
When using the cycle plugin to display a slideshow in IE(6/?), it won't start playing until all of the images have completely loaded. This causes a delay of 5-15 seconds depending on the size and quantity of images. There's no such problem with non-IE web browsers, however, all of which start playing the slideshow as soon as the first image has loaded. Does anyone know of a Cycle option or other workaround that can fix this? JR
[jQuery] Re: Superfish - Auto Arrows on sub menus only?
Thanks, but I now realize my question was not terribly clear. Superfish has the autoArrows option, but that adds arrows to ALL the list items having sub list items, at any level. What I would like is to only add arrows (with Superfish's autoArrow option) to list items that happen to have a sub-level of ul li, but that are NOT at the top level. ul id=nav liItem/li lia href=#Item 1/aDON'T ADD ARROW HERE ul lia href=#Item/a ADD ARROW HERE ul liItem/li liItem/li liItem/li /ul /li lia href=#Item/a/li lia href=#Item/a/li /ul /li /ul
[jQuery] (treeview) expandable / collapsable classes badly assigned in inactive tabs (jquery ui tabs)
Hi, I noticed that the expandable-hitarea and collapsable-hitarea classes are not assigned as they should in inactive tabs when using jquery ui tabs. The lists in these inactive tabs are expanded by default (just as they should) but the assigned class is expandable-hitarea, thus showing the wrong icon. This just occurs in inactive tabs, which have a display: none ! important css style. Any ideas to fix this?
Re: [jQuery] Jquery Tabs
try to use this tabs plugin http://www.etmvc.cn/project/show/63 http://www.etmvc.cn/project/show/63 StephenJacob wrote: I'm having an issue, which seems common, when loading tab content using the Jquery Tab plugin. It seems the content loads on the page prior to being tabbed. This causes the page to jump around for a split second before the content loads completely. Is there any way of fixing this issue? http://docs.jquery.com/UI/Tabs Thanks! -- View this message in context: http://old.nabble.com/Jquery-Tabs-tp26321361s27240p26328731.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: css based on url wildcard
Hi Michael,
Thanks so much for taking the time to reply. I have very limited
Javascript knowledge (learning). Are you able to offer any more clues
to get me on track?
Thanks in advance for your help!.
Jack
On Nov 9, 4:32 pm, Michel Belleville michel.bellevi...@gmail.com
wrote:
Straight js : window.location.url contains current url.
jQuery : $('#id_of_element').addClass('class') selects and element with the
id 'id_of_element' and adds the class 'class'.
I'll let you add the if and write the regexp (straight JS).
Michel Belleville
2009/11/9 Wacko Jacko jackson.be...@gmail.com
Hi All,
Just wondering if there is a way with jQuery of adding css to an id
based on a url wildcard? Eg, if the current url contains
'BlogRetrieve.aspx' add .class to this #id.
Thanks in advance for your help.
Jackson
[jQuery] Re: selector performance
On Nov 12, 6:11 am, Karl Swedberg k...@englishrules.com wrote: Are those tests really using jQuery 1.1.4? If so, they're hardly relevant now, unless you're using a very old version of jQuery. The tests are relevant in the context of the article. The point is really about improving performance by not making calls that don't do anything, which is stating the obvious. -- Rob
Re: [jQuery] SimpleModal issues when loading content via Ajax
I use this dialog plugin instead of SimpleModal, I'm feeling it works good.
http://www.etmvc.cn/project/show/61 http://www.etmvc.cn/project/show/61
Eric Getchell wrote:
Hello,
I’m having two issues with the SimpleModal jQuery plugin that I’m sure
someone knows the answers to. Essentially, I am using SimpleModal to
display informational windows/forms and I encountered an issue when
loading the display content via Ajax. To ensure that the rendering
problems were not a symptom of the HTML snippet that is being loaded,
I removed the Ajax call and embedded the content directly into the div
container - the page behaved correctly. If I load the exact same HTML
snippet via Ajax, I have encountered the following two issues:
- The “Close” button (which has the simplemodal-close class associated
to it) does not seem to close the modal window when clicked
- The positioning of the modal window has been calculated as if the
div containing the content was empty, so the window appears towards
the bottom of the screen
It would seem that an extra step needs to be taken after loading the
content via Ajax so that it is correctly processed by the Simple Modal
logic. Does anyone know what I would need to do to make this happen?
The following is my code that loads the content via Ajax:
function testSimpleModal()
{
$(#dialog).load(/snippet.html);
$(#dialog).modal({
overlay:80,
overlayCss: {backgroundColor:#000},
onShow: function (dialog){
$(#dialog.simplemodal-close).click(function (e)
{
alert(); // Test to see if forcing an event handler
solves
the issue
$.modal.close();
});
}
});
}
… and of course the div that is holding the content can’t get much
simpler:
div id=dialog style=display:none/div
--
View this message in context:
http://old.nabble.com/SimpleModal-issues-when-loading-content-via-Ajax-tp26304670s27240p26331156.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: How can i make a timer that i can stop with jquery?
it was admittedly a quick reply, but setInterval would be a path to take. sorry the verbose and novelized version wasn't typed out :-) On Nov 12, 8:39 pm, Michael Geary m...@mg.to wrote: Now MorningZ, that is possibly the worst comparison of setInterval() and setTimeout() that I've ever seen! (Please take that as a little good-natured ribbing among friends, OK?) Both setInterval() and setTimeout() are cancelable, using clearInterval() and clearTimeout() respectively. The difference between setInterval() and setTimeout() is that setTimeout() calls the callback function only once (or not at all if you cancel it first). setInterval() calls the callback function repeatedly until you cancel it. https://developer.mozilla.org/en/DOM/window.setIntervalhttps://developer.mozilla.org/en/DOM/window.setTimeout You're certainly right on the essential point: a bit of simple code using setInterval() or setTimeout() may well be all that Mark needs. Mark, you may want to look at the source code of that plugin and see where it calls one of these two functions. That will give you some idea of how you could use them in your own code. Also beware: this inside a setInterval() or setTimeout() callback is not what you expect! -Mike On Thu, Nov 12, 2009 at 5:28 PM, MorningZ morni...@gmail.com wrote: Not really requiring jQuery, just read up on JavaScript's setInterval, which is like setTimeout except you can cancel it On Nov 12, 7:39 pm, Mark mark...@gmail.com wrote: Hi, i tried this jquery countdown plugin: http://davidwalsh.name/jquery-countdown-pluginandit works neat.. but not for my interest. What i try to do is have this: Have a simple countdown that counts down from 5 to 0 then changes the text to Uploading... The plugin mentioned can do that but i also want to be able to cancel the countdown which it can't do. Can anyone point me to a plugin that does have that functionality? or how i make that in this plugin.. So what i want to be able to do: 5 4 3 2 1 0 Uploading... Or when cancel is pressed 5 4 3 2 CANCEL Just like that. I hope anyone can help me with this. Thanx, Mark.
[jQuery] URGENT!!! Need help!!! problem in IE carousel3d plugin on image click after ajax call
I did a workaround for now, because my client needed to have a release
to show the site, but I didn't found the problem yet...so I still need
HELP!!! I try a lot of possibilities to fix it, but with no
result...so if anyone can help me has soon as possible, I will really
appreciate that. Thank you very much in advance for your help.
The problem is with the carousel3d plugin on image click animation
afterajax call. The ajax call return a new set of images html tags
(like a change level function), but only in internet explorer, when
click on a new image. The animation start and go back at it initial
position. Here a link to my site to see the problem. --
http://www.afhrgolive.com/newVersion_AFHRGoLive/salon_virtuel_db_IE_Ajax-animation_bug.php
(to see the bug, click on Navigation - Guide and click on the
escalator icon...and after click on a image directly (not on the
boxcaption, on the image), you'll see what happen) I used IE7, for my
test.
Here a link to my carousel3d plugin too (
http://www.afhrgolive.com/newVersion_AFHRGoLive/jquery/jquery.carousel3d.js
) and here are my call function to change level.
script type=text/javascript
function changeLevel(floorLevelID) {
//remove carousel (free element from memory)
jQuery(function($) {
$(#carousel).html($(#holder_images).html
()).carousel3d( {control: 'buttons', speed:1, fadeEffect:1, textBox:1,
centerX: $('#carousel').offset().left + $('#carousel').width()/2.5,
centerY: 425, remove: 1 } );
});
//$(#holder_images).empty();
//$(#carousel).empty();
$(#holder_images img).remove();
$(#carousel img).remove();
$(#text).empty();
$(#text_boxcaption_img).empty();
$(#carouselText).empty();
$(#carouselTextBoxCaptionImg).empty();
//Get the new html for holder_images tag.
$.ajax({
url: salon_virtuel_change_floor_level.php?floorID= +
floorLevelID + tag=holder_images,
dataType: html,
cache: false,
async: false,
success: function(html){
$(#holder_images).append(html);
}
});
//Get the new html for carouselText tag.
$.ajax({
url: salon_virtuel_change_floor_level.php?floorID= +
floorLevelID + tag=carouselText,
dataType: html,
cache: false,
async: false,
success: function(html){
$(#carouselText).append(html);
}
});
//Refresh the carousel
jQuery(function($) {
$(#carousel).html($(#holder_images).html
()).carousel3d( {control: 'buttons', speed:1, fadeEffect:1, textBox:1,
centerX: $('#carousel').offset().left + $('#carousel').width()/2.5,
centerY: 425 } );
});
//close menu after changing floor Level
$(#sliding_box_nav_menu2).stop().animate({top:'610px'},
{queue:false,duration:300});
$(#container_nav_menu2).hide();
}
/script
[jQuery] Re: How can i make a timer that i can stop with jquery?
Hey Mark,
The plugin uses a recursive function to achieve the countdown. You
can cancel the countdown by checking a global variable with each
decrement in the number.
Line 19:
$(this).animate({
'fontSize': settings.endFontSize
},settings.duration,'',function() {
if (cancel_countdown == 1) return; // this cancels the
countdown
if(to settings.endNumber + 1) {
$(this).css('fontSize',settings.startFontSize).text(to
- 1).countDown(settings,to - 1);
}
else
{
settings.callBack(this);
}
});
You'll need to set the global variable 'cancel_countdown' when
starting, and canceling the countdown.
HTML:
input id=start_countdown type=button/input
input id=cancel_countdown type=button/input
More jQuery:
$(input#start_countdown).click(function(){
// start countdown code
cancel_countdown = 0;
});
$(input#stop_countdown).click(function(){
cancel_countdown = 1;
});
Hope this helps,
Renato.
On Nov 12, 4:39 pm, Mark mark...@gmail.com wrote:
Hi,
i tried this jquery countdown
plugin:http://davidwalsh.name/jquery-countdown-pluginand it works neat.. but
not for my interest.
What i try to do is have this:
Have a simple countdown that counts down from 5 to 0 then changes the
text to Uploading...
The plugin mentioned can do that but i also want to be able to
cancel the countdown which it can't do.
Can anyone point me to a plugin that does have that functionality? or
how i make that in this plugin..
So what i want to be able to do:
5
4
3
2
1
0
Uploading...
Or when cancel is pressed
5
4
3
2
CANCEL
Just like that.
I hope anyone can help me with this.
Thanx,
Mark.
[jQuery] Re: How can i make a timer that i can stop with jquery?
Great response, Mike. In the plugin that the OP mentioned, it uses neither, but uses a recursive function instead. To cancel the recursive function, one would need to use a variable, and check it's value with each recursive function call. I replied to this post earlier, but it didn't seem to post? Renato On Nov 12, 5:39 pm, Michael Geary m...@mg.to wrote: Now MorningZ, that is possibly the worst comparison of setInterval() and setTimeout() that I've ever seen! (Please take that as a little good-natured ribbing among friends, OK?) Both setInterval() and setTimeout() are cancelable, using clearInterval() and clearTimeout() respectively. The difference between setInterval() and setTimeout() is that setTimeout() calls the callback function only once (or not at all if you cancel it first). setInterval() calls the callback function repeatedly until you cancel it. https://developer.mozilla.org/en/DOM/window.setIntervalhttps://developer.mozilla.org/en/DOM/window.setTimeout You're certainly right on the essential point: a bit of simple code using setInterval() or setTimeout() may well be all that Mark needs. Mark, you may want to look at the source code of that plugin and see where it calls one of these two functions. That will give you some idea of how you could use them in your own code. Also beware: this inside a setInterval() or setTimeout() callback is not what you expect! -Mike On Thu, Nov 12, 2009 at 5:28 PM, MorningZ morni...@gmail.com wrote: Not really requiring jQuery, just read up on JavaScript's setInterval, which is like setTimeout except you can cancel it On Nov 12, 7:39 pm, Mark mark...@gmail.com wrote: Hi, i tried this jquery countdown plugin: http://davidwalsh.name/jquery-countdown-pluginandit works neat.. but not for my interest. What i try to do is have this: Have a simple countdown that counts down from 5 to 0 then changes the text to Uploading... The plugin mentioned can do that but i also want to be able to cancel the countdown which it can't do. Can anyone point me to a plugin that does have that functionality? or how i make that in this plugin.. So what i want to be able to do: 5 4 3 2 1 0 Uploading... Or when cancel is pressed 5 4 3 2 CANCEL Just like that. I hope anyone can help me with this. Thanx, Mark.
[jQuery] form validation: compare two values
I have a form with 2 fields, the minimum number of people needed for an event to happen and the maximum number who can register. I want to validate that the maximum is greater than or equal to the minimum. I don't immediately see how to do that with the validation plugin, but it ought to be possible. Any help?
[jQuery] Joomla Superfish menu affects other modules problem
Hello! I looked around a lot and could not fix the problem. I am using siteground template (http://joomla15.siteground.com/? template=siteground-j15-82) with joomla 1.5 . I have the vertical suckerfish menu on the main menu position (left) and I had to change the width to 20em, because of the long menu text, so the right border of the suckerfish is aligned with the vertical line on the right side of the menu. The problem is : All the modules on the left beneath the (enlarged width) superfish menu are not displayed properly. They are displayed over the suckerfish module on the right side, where the width was added to the superfish menu. Thank you in advance
[jQuery] image refresh problem due to browser cache
I am trying to display a image on my website. The image always has the
same file name, but the content will change each time it is requested.
I use the following code to refresh it on my web site, but it only
works with Firefox. Is there any better way to do it?
html
head
titleSimple Page/title
meta http-equiv=Content-Type content=text/html;
charset=utf-8
meta http-equiv=Expires content=-1
meta http-equiv=Pragma content=no-cache
meta http-equiv=Cache-Control content=no-store, no-cache,
must-revalidate, max-age=0
script src=http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/
jquery.min.js type=text/javascript/script
script type=text/javascript
function refreshimage( ) {
$(#imgNYC).attr(src, http://images.earthcam.com/
ec_metros/newyork/newyork/lindys.jpg);
$(#imgNYC).show();
setTimeout(refreshimage, 500);
}
$(document).ready(function(){
$(window).load(refreshimage());
});
/script
/head
body
table
tr
tdimg src=http://images.earthcam.com/ec_metros/newyork/
newyork/lindys.jpg alt= id=imgNYC /td
/tr
/table
/body
/html
[jQuery] Forgot something about the Superfish issue that I posted moments ago
Hello! I forgot to add that the problem with the Superfish menu and other modules is in Firefox. in IE works fine. Thank you again
[jQuery] Re: How to add click() function to a tr during grid loadComplete function.
I'm not quite familiar with jqGrid and how it creates tables, but when
using the click or bind function, it only applies to static
elements. If you want to bind click to anything generated
dynamically you will want to use the jquery live function.
I'm assuming that jqGrid creates rows dynamically.
Example syntax:
$(row).children('td').live(click, function(){
// do something here
});
More documentation on 'live'
http://docs.jquery.com/Events/live
Hope this helps,
Renato
On Nov 12, 2:57 pm, davebrown d...@dbws.net wrote:
Hi All,
Hoping someone might be able to help me here,
I'm trying specify a click function to a jqGrid's row during the
loadComplete event but having difficulty 'getting to' the tr element..
What I've been trying is this sort of thing but with no result..
var ids = jQuery(#cell_list).getDataIDs();
/* for each row loaded */
for(var i=0;iids.length;i++){
var row = ids[i];
$(row).children('td').click(function(){
// do something here
})
}
Any advice here greatly appreciated,
Thanks
--
View this message in
context:http://old.nabble.com/How-to-add-click%28%29-function-to-a-tr-during-...
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
[jQuery] Re: Nested Accordion
Hello Akbar, Here are two links that provide examples of nested accordions: http://adipalaz.awardspace.com/experiments/jquery/nested_accordion.html http://blog.evaria.com/wp-content/themes/blogvaria/jquery/index-multi.php Regards, Adriana
[jQuery] Re: image refresh problem due to browser cache
you could try appending some sort of query string on the end of the
image name?
http://images.earthcam.com/ec_metros/newyork/newyork/lindys.jpg?refreshImg=[random_number];
for [random_number] try generating a random number using javascript
then putting it there. I have heard that passing a query string can
trick browsers into thinking it is a different file.
On Nov 12, 6:02 pm, Jay jinqi...@gmail.com wrote:
I am trying to display a image on my website. The image always has the
same file name, but the content will change each time it is requested.
I use the following code to refresh it on my web site, but it only
works with Firefox. Is there any better way to do it?
html
head
titleSimple Page/title
meta http-equiv=Content-Type content=text/html;
charset=utf-8
meta http-equiv=Expires content=-1
meta http-equiv=Pragma content=no-cache
meta http-equiv=Cache-Control content=no-store, no-cache,
must-revalidate, max-age=0
script src=http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/
jquery.min.js type=text/javascript/script
script type=text/javascript
function refreshimage( ) {
$(#imgNYC).attr(src, http://images.earthcam.com/
ec_metros/newyork/newyork/lindys.jpg);
$(#imgNYC).show();
setTimeout(refreshimage, 500);
}
$(document).ready(function(){
$(window).load(refreshimage());
});
/script
/head
body
table
tr
tdimg src=http://images.earthcam.com/ec_metros/newyork/
newyork/lindys.jpg alt= id=imgNYC /td
/tr
/table
/body
/html
Re: [jQuery] Re: css based on url wildcard
Hey Jacques,
Here's how you make a regexp that looks for BlogRetrieve.aspx in a string
: /BlogRetrieve.aspx/ or new RegExp('BlogRetrieve.aspx')
Now here's how you check wether a string matches with a regexp : blah blah
blah.match(/blah/)
Here's a good site to learn about regexp (which are very popular amongst
developers on many languages for some reason), there's a part about
JavaScript :
http://www.regular-expressions.info/
I hope it helps you to learn, I'll let you putting the pieces together
(which basically means writing an if using the regexp to condition execution
of .addClass() ).
Michel Belleville
2009/11/13 Wacko Jacko jackson.be...@gmail.com
Hi Michael,
Thanks so much for taking the time to reply. I have very limited
Javascript knowledge (learning). Are you able to offer any more clues
to get me on track?
Thanks in advance for your help!.
Jack
On Nov 9, 4:32 pm, Michel Belleville michel.bellevi...@gmail.com
wrote:
Straight js : window.location.url contains current url.
jQuery : $('#id_of_element').addClass('class') selects and element with
the
id 'id_of_element' and adds the class 'class'.
I'll let you add the if and write the regexp (straight JS).
Michel Belleville
2009/11/9 Wacko Jacko jackson.be...@gmail.com
Hi All,
Just wondering if there is a way with jQuery of adding css to an id
based on a url wildcard? Eg, if the current url contains
'BlogRetrieve.aspx' add .class to this #id.
Thanks in advance for your help.
Jackson
[jQuery] modal popup is not working with Update panel
Hi , I am using jquery plugin for modal popup.in my page i am using update panel for opening the search window , this is the content page i used master page also. while clicking search button,it will trigger the updatepanel search window. i want this window should open like modal popup, so i used jquery plugin for doing this, but its not working properly please send reply soon Thanks in advance. Regards, Azeez.
Re: [jQuery] Re: Superfish - Auto Arrows on sub menus only?
Thanks, but I now realize my question was not terribly clear.
Superfish has the autoArrows option, but that adds arrows to ALL the
list items having sub list items, at any level. What I would like is
to only add arrows (with Superfish's autoArrow option) to list items
that happen to have a sub-level of ul li, but that are NOT at the top
level.
Well, just delete the markup for the arrows then:
$('#nav li a span').remove();
--
Andrei Eftimie
http://eftimie.com
+40 758 833 281
Punct
http://designpunct.ro
[jQuery] Re: modal popup is not working with Update panel
Hi
This is my aspx page
%@ Page Language=C# MasterPageFile=~/C2SFAMaster.master
AutoEventWireup=true CodeFile=Sales_List.aspx.cs
Inherits=Sales_List Title=Primary Sales %
%@ Register Assembly=AjaxControlToolkit
Namespace=AjaxControlToolkit TagPrefix=cc1 %
asp:Content ID=Content1 ContentPlaceHolderID=ContentPlaceHolder1
Runat=Server
script type=text/javascript
function pop()
{
$.blockUI({ message: h1Remote call in progress.../h1 });
}
$(document).ready(function() {
$([id$='btn_search']).click(function() {
document.getElementById(srdiv).style.display == '' ;
$.blockUI({ message: $('#srdiv') });
});
$('#btn_srclose').click(function() {
alert('close');
$.unblockUI();
});
});
/script
asp:Button id=btn_search onclick=btn_search_Click runat=server
CssClass=Button Text=Search /asp:Button
asp:UpdatePanel id=srpnl runat=server
UpdateMode=Conditional
contenttemplate
div id=srdiv style=LEFT: 10%; POSITION: absolute; TOP: 72%;width:
810px;height:400px;display :none ;
TABLE id=searchtable runat=server cellSpacing=0 cellPadding=0
border=0 TBODY
TR class=TableHDColor align=centerTD class=TableHDColor
colSpan=4Search/TD/TR
TRTD style=HEIGHT: 26px class=CellColor3asp:TextBox
id=sr_docno runat=server Width=60px SkinID=Textboxs/
asp:TextBox
asp:TextBox id=sr_year runat=server Width=60px
__designer:wfdid=w97 SkinID=Textboxs/asp:TextBox
asp:TextBox id=sr_invoice runat=server Width=100px
__designer:wfdid=w102 SkinID=Textboxs/asp:TextBox
/TD/TR
TRTD class=TableBgColor align=centerTABLE style=WIDTH: 1px
cellPadding=0 border=0TBODYTRTD style=WIDTH: 100pxasp:Button
id=btn_srview onclick=btn_srview_Click runat=server
CssClass=button Text=GO __designer:wfdid=w103
onClientClick=return srvalid();/asp:Button/TDTD style=WIDTH:
100pxasp:Button id=btn_srclose onclick=btn_srclose_Click
runat=server CssClass=button Text=Close
__designer:wfdid=w104/asp:Button/TD/TR/TBODY/TABLE/TD/
TR
TRTDasp:DataList id=SrList runat=server Width=806px
OnSelectedIndexChanged=SrList_SelectedIndexChanged
SkinID=DataLists1HeaderTemplate
asp:Label id=Label1 runat=server Width=75px Text=Doc No
__designer:wfdid=w82/asp:Label asp:Label id=Label2
runat=server Width=60px Text=Year __designer:wfdid=w83/
asp:Label /HeaderTemplate
ItemTemplate
asp:RadioButton id=srselect onclick=pop(); runat=server
AutoPostBack=True OnCheckedChanged=SrList_SelectedIndexChanged/
asp:RadioButton asp:Label id=lbl_srno runat=server Width=60px
__designer:wfdid=w142 Text='%# Eval(SRNO) %'/asp:Label
asp:Label id=lbl_year runat=server Width=60px
__designer:wfdid=w143 Text='%# Eval(SYEAR) %'/asp:Label /
ItemTemplate
/asp:DataList
/TD/TR/TBODY/TABLE
/div
/contenttemplate
triggers
asp:AsyncPostBackTrigger ControlID=btn_search EventName=Click/
asp:AsyncPostBackTrigger
asp:AsyncPostBackTrigger ControlID=btn_srview EventName=Click/
asp:AsyncPostBackTrigger
asp:AsyncPostBackTrigger ControlID=btn_srclose EventName=Click/
asp:AsyncPostBackTrigger
/triggers
/asp:UpdatePanel
/asp:Content
[jQuery] Re: Division Blocking is not working
hi Thanks . its working now Regards, Azeez
