[jQuery] Re: how to do some animation when the page loads?
Hey Oliur,
You could just do that after the document ready:
$(document).ready(function(){
$(.divname).animate({
opacity: 0.5,
}, 300 );
});
That should do the trick, I think.
Greetz,
Rick
On Jan 9, 2:53 pm, Oliur o.r.chowdh...@gmail.com wrote:
when the DOM is ready you can write
$(document).ready(function(){
$(#divname).hide();
});
Say now, you want to try and do some animation done by default, (in
the below example I have done some animation only when the user do
mouse over, how can i do that by default as in when the page loads)
$(document).ready(function(){
$(.divname).mouseover(function(){
$(.divname).animate({
opacity: 0.5,
}, 300 );
});
});
[jQuery] Re: how to do some animation when the page loads?
yes it did, thanks a lot :) It looks so simple :)
[jQuery] Re: How to Do This
Hi.. I don't see what you want to do... please be more specific :) On Sep 1, 1:23 pm, bharathbhooshan ambati bharathbhooshan.amb...@gmail.com wrote: Hi I have seen one site which consists of share/Email in a single tab. Can any body tell me hw to do this FYI.. site:http://www.networkworld.com/news/2009/083109-vmworld-xen-cloud-initia... Please find the attachment -- భరత్ భూషణ్ అంబటి imp.JPG 22KViewDownload
[jQuery] Re: How to Do This
In the site there was a link called as Share/Email if you click on that a screen appears with Sitehttp://www.networkworld.com/news/2009/083109-vmworld-xen-cloud-initiative.html?hpg1=bn ScreenShot http://img136.imageshack.us/img136/9051/impf.jpg How to do this using jquery On Tue, Sep 1, 2009 at 6:41 PM, Glazz brunofgas...@live.com.pt wrote: Hi.. I don't see what you want to do... please be more specific :) On Sep 1, 1:23 pm, bharathbhooshan ambati bharathbhooshan.amb...@gmail.com wrote: Hi I have seen one site which consists of share/Email in a single tab. Can any body tell me hw to do this FYI.. site: http://www.networkworld.com/news/2009/083109-vmworld-xen-cloud-initia... Please find the attachment -- భరత్ భూషణ్ అంబటి imp.JPG 22KViewDownload -- భరత్ భూషణ్ అంబటి
[jQuery] Re: How to do can promise my event will be executed first when i add a event listenser?
See this thread: http://groups.google.com/group/jquery-en/browse_thread/thread/da7ee3f9c17db398/f7015d7b93ae3565?lnk=gstq=event+order#f7015d7b93ae3565 On Apr 7, 4:18 am, Jackal jum...@gmail.com wrote: as title, thanks.
[jQuery] Re: how to do '++' in jQuery
Probably there's a better way. Doesn't look elegant.
$('xx').width($('xx').width()++) ;
On Jan 21, 2:05 am, David .Wu chan1...@gmail.com wrote:
some times we want to do some animation we use xxx.width++
in jQuery we give value like this $('xx').width(value)
how to do ++ thing in this way?
[jQuery] Re: how to do '++' in jQuery
like this
$(xx).animate({ width: +=10px },1000);
this will add 10 pixels to the width, in a second.
Kean wrote:
Probably there's a better way. Doesn't look elegant.
$('xx').width($('xx').width()++) ;
On Jan 21, 2:05 am, David .Wu chan1...@gmail.com wrote:
some times we want to do some animation we use xxx.width++
in jQuery we give value like this $('xx').width(value)
how to do ++ thing in this way?
[jQuery] Re: how to do '++' in jQuery
This I didn't know, could be useful.
Balazs Endresz wrote:
Moreover, as of 1.3 this works like .css, so there's no animation at
all:
$(xx).animate({ width: +=10px }, 0);
(In 1.2 if you set the duration to 0 then the default value is used.)
On Jan 21, 1:00 pm, Liam Potter radioactiv...@gmail.com wrote:
like this
$(xx).animate({ width: +=10px },1000);
this will add 10 pixels to the width, in a second.
Kean wrote:
Probably there's a better way. Doesn't look elegant.
$('xx').width($('xx').width()++) ;
On Jan 21, 2:05 am, David .Wu chan1...@gmail.com wrote:
some times we want to do some animation we use xxx.width++
in jQuery we give value like this $('xx').width(value)
how to do ++ thing in this way?
[jQuery] Re: how to do '++' in jQuery
Moreover, as of 1.3 this works like .css, so there's no animation at
all:
$(xx).animate({ width: +=10px }, 0);
(In 1.2 if you set the duration to 0 then the default value is used.)
On Jan 21, 1:00 pm, Liam Potter radioactiv...@gmail.com wrote:
like this
$(xx).animate({ width: +=10px },1000);
this will add 10 pixels to the width, in a second.
Kean wrote:
Probably there's a better way. Doesn't look elegant.
$('xx').width($('xx').width()++) ;
On Jan 21, 2:05 am, David .Wu chan1...@gmail.com wrote:
some times we want to do some animation we use xxx.width++
in jQuery we give value like this $('xx').width(value)
how to do ++ thing in this way?
[jQuery] Re: how to do '++' in jQuery
yup, it's cool, but how about scrollLeft()++?
On 1月21日, 下午9時22分, Liam Potter radioactiv...@gmail.com wrote:
This I didn't know, could be useful.
Balazs Endresz wrote:
Moreover, as of 1.3 this works like .css, so there's no animation at
all:
$(xx).animate({ width: +=10px }, 0);
(In 1.2 if you set the duration to 0 then the default value is used.)
On Jan 21, 1:00 pm, Liam Potter radioactiv...@gmail.com wrote:
like this
$(xx).animate({ width: +=10px },1000);
this will add 10 pixels to the width, in a second.
Kean wrote:
Probably there's a better way. Doesn't look elegant.
$('xx').width($('xx').width()++) ;
On Jan 21, 2:05 am, David .Wu chan1...@gmail.com wrote:
some times we want to do some animation we use xxx.width++
in jQuery we give value like this $('xx').width(value)
how to do ++ thing in this way?
[jQuery] Re: How to do anything after animate finished
activate the button in a callback function after the animate
var isClickable = true;
right.click(function()
{
if(ul.css('left') != (maxMove * -1) + 'px'
isClickable)
{
isClickable = false;
ul.animate({left:'-=50px'},function(){
isClickable = true;
});
}
});
On Tue, Nov 11, 2008 at 11:06 AM, David .Wu [EMAIL PROTECTED] wrote:
Hi everybody
This my testing gallery slider, it will count image's amount, and
prevent it not to outside the wrapper, but I got one problem, if user
click button after the animation finished, it's done well, but if user
click too fast, the js will not catch the left property in time
correctly, how to fix the bug?
CSS
style type=text/css
!--
body { font-size: 12px; }
#wrapper
{
height: 50px;
width: 50px;
overflow: hidden;
position: relative;
border:1px #FF solid;
}
ul
{
margin: 0px;
padding: 0px;
list-style-type: none;
position: absolute;
white-space:nowrap;
}
li
{
display:inline;
margin:0 -3px 0 0;
width:50px;
height:50px;
overflow:hidden;
}
--
/style
HTML
div id=wrapper
ul
liimg src=1.jpg border=0 //li
liimg src=2.jpg border=0 //li
liimg src=3.jpg border=0 //li
/ul
/div
input type=button name=left id=left value=left /
input type=button name=right id=right value=right /
JavaScript
script language=javascript
!--
$(document).ready(function()
{
var wrapper = $('#wrapper');
var ul = $('ul',wrapper);
var itemsWidth = $('li',ul).outerWidth();
var itemsLen = $('li',ul).size();
var maxMove = (itemsLen - 1) * itemsWidth;
var minMove = 0;
var right = $('#right');
var left = $('#left');
right.click(function()
{
if(ul.css('left') != (maxMove * -1) + 'px')
{
ul.animate({left:'-=50px'});
}
});
left.click(function()
{
if(ul.css('left') != minMove + 'px')
{
ul.animate({left:'+=50px'});
}
});
});
//--
/script
[jQuery] Re: How to do anything after animate finished
ooops, I got another problem,
in FF3, CSS property white-space will make image have 3px padding, but in
IE, it's not, any good suggestion?
On Tue, Nov 11, 2008 at 7:54 PM, Alexandre Plennevaux
[EMAIL PROTECTED]wrote:
my pleasure :)
On Tue, Nov 11, 2008 at 12:53 PM, David Wu [EMAIL PROTECTED] wrote:
Fantastic, thanks a lot
On Tue, Nov 11, 2008 at 7:32 PM, Alexandre Plennevaux
[EMAIL PROTECTED]
wrote:
activate the button in a callback function after the animate
var isClickable = true;
right.click(function()
{
if(ul.css('left') != (maxMove * -1) + 'px'
isClickable)
{
isClickable = false;
ul.animate({left:'-=50px'},function(){
isClickable = true;
});
}
});
On Tue, Nov 11, 2008 at 11:06 AM, David .Wu [EMAIL PROTECTED] wrote:
Hi everybody
This my testing gallery slider, it will count image's amount, and
prevent it not to outside the wrapper, but I got one problem, if user
click button after the animation finished, it's done well, but if user
click too fast, the js will not catch the left property in time
correctly, how to fix the bug?
CSS
style type=text/css
!--
body { font-size: 12px; }
#wrapper
{
height: 50px;
width: 50px;
overflow: hidden;
position: relative;
border:1px #FF solid;
}
ul
{
margin: 0px;
padding: 0px;
list-style-type: none;
position: absolute;
white-space:nowrap;
}
li
{
display:inline;
margin:0 -3px 0 0;
width:50px;
height:50px;
overflow:hidden;
}
--
/style
HTML
div id=wrapper
ul
liimg src=1.jpg border=0 //li
liimg src=2.jpg border=0 //li
liimg src=3.jpg border=0 //li
/ul
/div
input type=button name=left id=left value=left /
input type=button name=right id=right value=right /
JavaScript
script language=javascript
!--
$(document).ready(function()
{
var wrapper = $('#wrapper');
var ul = $('ul',wrapper);
var itemsWidth = $('li',ul).outerWidth();
var itemsLen = $('li',ul).size();
var maxMove = (itemsLen - 1) * itemsWidth;
var minMove = 0;
var right = $('#right');
var left = $('#left');
right.click(function()
{
if(ul.css('left') != (maxMove * -1) + 'px')
{
ul.animate({left:'-=50px'});
}
});
left.click(function()
{
if(ul.css('left') != minMove + 'px')
{
ul.animate({left:'+=50px'});
}
});
});
//--
/script
[jQuery] Re: How to do anything after animate finished
Fantastic, thanks a lot
On Tue, Nov 11, 2008 at 7:32 PM, Alexandre Plennevaux
[EMAIL PROTECTED]wrote:
activate the button in a callback function after the animate
var isClickable = true;
right.click(function()
{
if(ul.css('left') != (maxMove * -1) + 'px'
isClickable)
{
isClickable = false;
ul.animate({left:'-=50px'},function(){
isClickable = true;
});
}
});
On Tue, Nov 11, 2008 at 11:06 AM, David .Wu [EMAIL PROTECTED] wrote:
Hi everybody
This my testing gallery slider, it will count image's amount, and
prevent it not to outside the wrapper, but I got one problem, if user
click button after the animation finished, it's done well, but if user
click too fast, the js will not catch the left property in time
correctly, how to fix the bug?
CSS
style type=text/css
!--
body { font-size: 12px; }
#wrapper
{
height: 50px;
width: 50px;
overflow: hidden;
position: relative;
border:1px #FF solid;
}
ul
{
margin: 0px;
padding: 0px;
list-style-type: none;
position: absolute;
white-space:nowrap;
}
li
{
display:inline;
margin:0 -3px 0 0;
width:50px;
height:50px;
overflow:hidden;
}
--
/style
HTML
div id=wrapper
ul
liimg src=1.jpg border=0 //li
liimg src=2.jpg border=0 //li
liimg src=3.jpg border=0 //li
/ul
/div
input type=button name=left id=left value=left /
input type=button name=right id=right value=right /
JavaScript
script language=javascript
!--
$(document).ready(function()
{
var wrapper = $('#wrapper');
var ul = $('ul',wrapper);
var itemsWidth = $('li',ul).outerWidth();
var itemsLen = $('li',ul).size();
var maxMove = (itemsLen - 1) * itemsWidth;
var minMove = 0;
var right = $('#right');
var left = $('#left');
right.click(function()
{
if(ul.css('left') != (maxMove * -1) + 'px')
{
ul.animate({left:'-=50px'});
}
});
left.click(function()
{
if(ul.css('left') != minMove + 'px')
{
ul.animate({left:'+=50px'});
}
});
});
//--
/script
[jQuery] Re: How to do anything after animate finished
my pleasure :)
On Tue, Nov 11, 2008 at 12:53 PM, David Wu [EMAIL PROTECTED] wrote:
Fantastic, thanks a lot
On Tue, Nov 11, 2008 at 7:32 PM, Alexandre Plennevaux [EMAIL PROTECTED]
wrote:
activate the button in a callback function after the animate
var isClickable = true;
right.click(function()
{
if(ul.css('left') != (maxMove * -1) + 'px'
isClickable)
{
isClickable = false;
ul.animate({left:'-=50px'},function(){
isClickable = true;
});
}
});
On Tue, Nov 11, 2008 at 11:06 AM, David .Wu [EMAIL PROTECTED] wrote:
Hi everybody
This my testing gallery slider, it will count image's amount, and
prevent it not to outside the wrapper, but I got one problem, if user
click button after the animation finished, it's done well, but if user
click too fast, the js will not catch the left property in time
correctly, how to fix the bug?
CSS
style type=text/css
!--
body { font-size: 12px; }
#wrapper
{
height: 50px;
width: 50px;
overflow: hidden;
position: relative;
border:1px #FF solid;
}
ul
{
margin: 0px;
padding: 0px;
list-style-type: none;
position: absolute;
white-space:nowrap;
}
li
{
display:inline;
margin:0 -3px 0 0;
width:50px;
height:50px;
overflow:hidden;
}
--
/style
HTML
div id=wrapper
ul
liimg src=1.jpg border=0 //li
liimg src=2.jpg border=0 //li
liimg src=3.jpg border=0 //li
/ul
/div
input type=button name=left id=left value=left /
input type=button name=right id=right value=right /
JavaScript
script language=javascript
!--
$(document).ready(function()
{
var wrapper = $('#wrapper');
var ul = $('ul',wrapper);
var itemsWidth = $('li',ul).outerWidth();
var itemsLen = $('li',ul).size();
var maxMove = (itemsLen - 1) * itemsWidth;
var minMove = 0;
var right = $('#right');
var left = $('#left');
right.click(function()
{
if(ul.css('left') != (maxMove * -1) + 'px')
{
ul.animate({left:'-=50px'});
}
});
left.click(function()
{
if(ul.css('left') != minMove + 'px')
{
ul.animate({left:'+=50px'});
}
});
});
//--
/script
[jQuery] Re: How to do something using JQuery
try this;
[number] is either the SQL row ID of the name (good), or an arbitrary index
(less good).
1) each checkbox gets a html id 'name_[number]_cb'
2) each name gets a html id 'name_[number]_label'
3) each circle gets a html id 'name_[number]_button'
4) each circle gets a html onclick='yournamespace.showInfoForName(this,
event)'
then load this js:
var yournamespace = {
showInfoForName : function (element, event) {
//some vars that you need to intialize;
var parent = $('table#names')[0]; //set only to parent table or
div of names-list.
//create the view
var view = document.createElement (DIV);
view.id = element.id+'_view';
view.className = 'namesInputView'; //style layout with CSS
$(view).css ({
visibility : 'visible',
display : none, //override: dont display anything yet
position: 'absolute',
width : '400px', //desired size, change if u want
height : '300px'
})
document.body.appendChild (view);//add it to the DOM somewhere
to prevent IE mem leaks
var viewHTML = '';
viewHTML += 'some INPUT fields and makeup';
view.innerHTML = viewHTML;
//take the size of the view in case contents doesnt fit in it
viewWidth = view.offsetWidth;
viewHeight = view.offsetHeight;
//figure out where to put the view
var t = 0, l = 0, e = element;
while (e!=parent) {
t += e.offsetTop;
l += e.offsetLeft;
e = e.offsetParent;
};
//optional: adjust t and l if the view is out of view (near edges of
browser)
//figure this one out 4 yourself.
//move view to where it belongs in DOM
document.body.removeChild (view);
$(view).css ({
display: 'none',
overflow: 'hidden',
top : t+'px',
left : l+'px',
height : viewHeight+'px', //make sure everything is in view. at
desired size you specify the desired width, height is adjusted to whats
needed.
zIndex: 99
});
parent.appendChild (view);
$(view).fadeIn (700); //700 milliseconds
}
};
On Fri, Sep 5, 2008 at 9:51 PM, SEMMatt2 [EMAIL PROTECTED] wrote:
Hello,
I am fairly new to JQuery but it's so nice and simple to use that as
soon as I have some direction I can take it from there. So, my
question is, can anyone direct me regarding this project:
I have a list of names (maybe a few hundred). Each name will have a
checkbox next to it. After clicking on a little circle press down
(forget what there called...) a box should slide open or come up right
next to the name that let's a user enter in some information (it's
about the name that they selected). Once they enter the information,
the box slides back into place. Then, the user scrolls down to the
bottom of the page and clicks submit. Everything gets submitted
(checked boxes and the more information).
Thoughts...how would I use Jquery to accomplish this?
Thanks,
Matt
[jQuery] Re: How to do a document.getElementById(mytextbo).select() in jquery?
Thanks you, I will give this a try On May 12, 7:42 pm, Karl Rudd [EMAIL PROTECTED] wrote: $(#mytextbo)[0].select(); jQuery(selectorString), or the shortcut $(selectorString), always return an array like object. To run the select() on it you have to access one of the raw elements it contains, hence the [0], which retrieves the first element in the array. Karl Rudd On Tue, May 13, 2008 at 12:19 PM, [EMAIL PROTECTED] wrote: I've been searching and i'm not quite sure how to do it. Anyone else know how? Thanks
[jQuery] Re: How to do a document.getElementById(mytextbo).select() in jquery?
$(#mytextbo)[0].select(); jQuery(selectorString), or the shortcut $(selectorString), always return an array like object. To run the select() on it you have to access one of the raw elements it contains, hence the [0], which retrieves the first element in the array. Karl Rudd On Tue, May 13, 2008 at 12:19 PM, [EMAIL PROTECTED] wrote: I've been searching and i'm not quite sure how to do it. Anyone else know how? Thanks
