[jQuery] Re: Toggle Classes
I have just updated my code and still no luck :(
Here is my new code... can anyone help?
Thanks, Craig
JS
$(document).ready(function(){
$('.expander_content').hide();
$('.expander h3').click(function () {
$(this).next('.expander_content').slideToggle('slow');
$(this).next('.arrow').toggleClass('arrow_up');
});
});
HTML
Design Services
Design supplied by us
orem ipsum dolor sit amet, consectetuer adipiscing
elit orem ipsum dolor sit amet, consectetuer adipiscing elit
Design supplied by us
orem ipsum dolor sit amet, consectetuer adipiscing
elit orem ipsum dolor sit amet, consectetuer adipiscing elit
On Oct 7, 10:25 am, craigeves wrote:
> Hi
>
> Can anyone help? I'm trying to toggle a class on the span .arrow when
> you click .msg_head. I have several classes of .arrow on the page and
> only want to toggle the class of the span within the element i'm
> clicking. This is my code - but it doesn't work... any advice?
>
> Thanks
>
> Craig
>
> $(".msg_head").click(function(){
> $(this).next(".msg_body").slideToggle("slow");
> $(this).next(".arrow").toggleClass("arrow_up");
> });
>
>
>
> Design supplied by us class="arrow">
>
> orem ipsum dolor sit amet, consectetuer adipiscing
> elit orem ipsum dolor sit amet, consectetuer adipiscing elit
> Design by
> you
>
>
> Design supplied by you class="arrow">
>
> orem ipsum dolor sit amet, consectetuer adipiscing
> elit orem ipsum dolor sit amet, consectetuer adipiscing elit
> Design by you p>
>
>
[jQuery] Toggle Classes
Hi
Can anyone help? I'm trying to toggle a class on the span .arrow when
you click .msg_head. I have several classes of .arrow on the page and
only want to toggle the class of the span within the element i'm
clicking. This is my code - but it doesn't work... any advice?
Thanks
Craig
$(".msg_head").click(function(){
$(this).next(".msg_body").slideToggle("slow");
$(this).next(".arrow").toggleClass("arrow_up");
});
Design supplied by us
orem ipsum dolor sit amet, consectetuer adipiscing
elit orem ipsum dolor sit amet, consectetuer adipiscing elit
Design by
you
Design supplied by you
orem ipsum dolor sit amet, consectetuer adipiscing
elit orem ipsum dolor sit amet, consectetuer adipiscing elit
Design by you
[jQuery] Re: jQuery UI Portlets & Cookies
Thanks so much for this - i'll compare the script that you just
submitted to the one i submitted to see where i went wrong.
Thanks again
Craig
On Oct 2, 4:21 pm, Nalum wrote:
> I've updated the javascript here.http://pastebin.com/m4caef476
>
> If you need any help in understanding whats happening here let me know
> and I'll try to explain it, I'm not the best at explaining things
> though.
>
> Nalum
>
> On Oct 2, 4:06 pm, craigeves wrote:
>
> > Hi Nalum
>
> > I have tried and amended the code as you suggested - but still no
> > luck?
>
> > Thanks for the tip (pastebin). Here is my full code now. Please would
> > you take a quick look and let me know where im going wrong?
>
> >http://pastebin.com/m4dab8bb2
>
> > Thanks for your help in this - it's really appreciated!
>
> > Craig
>
> > On Oct 2, 3:40 pm, Nalum wrote:
>
> > > Hello Craig,
> > > When you need to show code you should try using a site
> > > likehttp://pastebin.com
> > > as it'll make it easier to read and your post wont be so long.
>
> > > You'll need to be able to work with cookies, I would suggest this
> > > jquery pluginhttp://plugins.jquery.com/project/cookie.
>
> > > I've explained how it works in this code
> > > herehttp://pastebin.com/m2c0e0bde.
>
> > > Hope this helps you out.
>
> > > Nalum
>
> > > On Oct 2, 3:15 pm, craigeves wrote:
>
> > > > Here it is - thanks for your help again
>
> > > >
> > > >
> > > >
> > > > jQuery UI Sortable - Portlets
> > > >
> > > >
> > > >
> > > >
> > > > .column {
> > > > width: 300px;
> > > > float: left;
> > > > background-color: #ee;
> > > > margin-right: 25px;
> > > > padding-top: 10px;
> > > > padding-right: 10px;
> > > > padding-bottom: 0px;
> > > > padding-left: 10px;
> > > > height: 700px;}
>
> > > > .portlet {
> > > > background-color: #FFF;
> > > > margin-top: 0;
> > > > margin-right: 0;
> > > > margin-bottom: 10;
> > > > margin-left: 0;}
>
> > > > .portlet-header {
> > > > margin: 0px;
> > > > font-family: Arial, Helvetica, sans-serif;
> > > > font-size: 18px;
> > > > background-color: #333;
> > > > padding: 10px;
> > > > color: #FFF;}
>
> > > > .portlet-header .ui-icon { float: right; }
> > > > .portlet-content {
> > > > padding: 10px;
> > > > font-family: Arial, Helvetica, sans-serif;
> > > > font-size: 12px;
> > > > line-height: 18px;
> > > > color: #333;
> > > > margin-bottom: 10px;}
>
> > > > .ui-sortable-placeholder { border: 1px dotted black; visibility:
> > > > visible}
> > > > .ui-sortable-placeholder * { visibility: hidden; }
> > > >
> > > >
>
> > > > $(function() {
> > > > $(".column").sortable({
> > > > handle:
> > > > '.portlet-header',
> > > > connectWith: '.column'
> > > > });
>
> > > > $(".column").disableSelection();
> > > > });
> > > >
> > > >
> > > >
> > > >
>
> > > >
>
> > > >
> > > > Feeds
> > > > Lorem ipsum dolor sit amet,
> > > > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > > > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > > > elit.
> > > >
>
> > > >
> > > > News
> > > > Lorem ipsum dolor sit amet,
> > > > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > > > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > > > elit.
> > > >
[jQuery] Re: jQuery UI Portlets & Cookies
Hi Nalum
I have tried and amended the code as you suggested - but still no
luck?
Thanks for the tip (pastebin). Here is my full code now. Please would
you take a quick look and let me know where im going wrong?
http://pastebin.com/m4dab8bb2
Thanks for your help in this - it's really appreciated!
Craig
On Oct 2, 3:40 pm, Nalum wrote:
> Hello Craig,
> When you need to show code you should try using a site likehttp://pastebin.com
> as it'll make it easier to read and your post wont be so long.
>
> You'll need to be able to work with cookies, I would suggest this
> jquery pluginhttp://plugins.jquery.com/project/cookie.
>
> I've explained how it works in this code herehttp://pastebin.com/m2c0e0bde.
>
> Hope this helps you out.
>
> Nalum
>
> On Oct 2, 3:15 pm, craigeves wrote:
>
> > Here it is - thanks for your help again
>
> >
> >
> >
> > jQuery UI Sortable - Portlets
> >
> >
> >
> >
> > .column {
> > width: 300px;
> > float: left;
> > background-color: #ee;
> > margin-right: 25px;
> > padding-top: 10px;
> > padding-right: 10px;
> > padding-bottom: 0px;
> > padding-left: 10px;
> > height: 700px;}
>
> > .portlet {
> > background-color: #FFF;
> > margin-top: 0;
> > margin-right: 0;
> > margin-bottom: 10;
> > margin-left: 0;}
>
> > .portlet-header {
> > margin: 0px;
> > font-family: Arial, Helvetica, sans-serif;
> > font-size: 18px;
> > background-color: #333;
> > padding: 10px;
> > color: #FFF;}
>
> > .portlet-header .ui-icon { float: right; }
> > .portlet-content {
> > padding: 10px;
> > font-family: Arial, Helvetica, sans-serif;
> > font-size: 12px;
> > line-height: 18px;
> > color: #333;
> > margin-bottom: 10px;}
>
> > .ui-sortable-placeholder { border: 1px dotted black; visibility:
> > visible}
> > .ui-sortable-placeholder * { visibility: hidden; }
> >
> >
>
> > $(function() {
> > $(".column").sortable({
> > handle: '.portlet-header',
> > connectWith: '.column'
> > });
>
> > $(".column").disableSelection();
> > });
> >
> >
> >
> >
>
> >
>
> >
> > Feeds
> > Lorem ipsum dolor sit amet,
> > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > elit.
> >
>
> >
> > News
> > Lorem ipsum dolor sit amet,
> > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > elit.
> >
>
> >
>
> >
>
> >
> > Shopping
> > Lorem ipsum dolor sit amet,
> > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > elit.
> >
> > sddfds
> >
>
> >
>
> >
> > Links
> > Lorem ipsum dolor sit amet,
> > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > elit.
> >
>
> >
> > Images
> > Lorem ipsum dolor sit amet,
> > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > elit.
> >
>
> >
>
> >
> >
> >
>
> > On Oct 2, 3:09 pm, Nalum wrote:
>
> > > Is the code in the original post all the code you have?
>
> > > On Oct 2, 3:03 pm, craigeves wrote:
>
> > > > Thanks for this - but I don't understand where it would fit into my
> > > > script? I'm only just starting in jQuery...
>
> > > > Also, will this save the position o
[jQuery] Re: jQuery UI Portlets & Cookies
Here it is - thanks for your help again
jQuery UI Sortable - Portlets
.column {
width: 300px;
float: left;
background-color: #ee;
margin-right: 25px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 0px;
padding-left: 10px;
height: 700px;
}
.portlet {
background-color: #FFF;
margin-top: 0;
margin-right: 0;
margin-bottom: 10;
margin-left: 0;
}
.portlet-header {
margin: 0px;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
background-color: #333;
padding: 10px;
color: #FFF;
}
.portlet-header .ui-icon { float: right; }
.portlet-content {
padding: 10px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 18px;
color: #333;
margin-bottom: 10px;
}
.ui-sortable-placeholder { border: 1px dotted black; visibility:
visible}
.ui-sortable-placeholder * { visibility: hidden; }
$(function() {
$(".column").sortable({
handle: '.portlet-header',
connectWith: '.column'
});
$(".column").disableSelection();
});
Feeds
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit.
News
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit.
Shopping
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit.
sddfds
Links
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit.
Images
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit.
On Oct 2, 3:09 pm, Nalum wrote:
> Is the code in the original post all the code you have?
>
> On Oct 2, 3:03 pm, craigeves wrote:
>
> > Thanks for this - but I don't understand where it would fit into my
> > script? I'm only just starting in jQuery...
>
> > Also, will this save the position of the portlet no matter which
> > column it's in? It's just that it looks like it's related to a closed
> > and expanded portlet state.
>
> > Thanks for your time.
>
> > Craig
>
> > On Oct 2, 2:58 pm, Nalum wrote:
>
> > > Hello Craig,
> > > I've done this before by building up a string e.g. box-
> > > id1,collapsed;box-id5,not-collapsed;box-id3,collapsed|box-
> > > id4,collapsed;box-id2,not-collapsed;box-id6,collapsed;
>
> > > In the javascript do something like thishttp://pastebin.com/m90a2af6
>
> > > Hope this helps,
> > > Nalum
>
> > > On Oct 2, 2:35 pm, craigeves wrote:
>
> > > > anyone?
>
> > > > On Oct 2, 12:08 am, craigeves wrote:
>
> > > > > Please can someone help?
>
> > > > > I am using the jQuery UI (sortable) Portlets code - but I want to use
> > > > > the jQuery cookies plugin to remember the order of the portlets. I
> > > > > don't know where to start - and searching the net for an answer only
> > > > > brings up sortable ul and li.
>
> > > > > Please help.
>
> > > > > Code:
> > > > >
> > > > > $(function() {
> > > > > $(".column").sortable({
> > > > > connectWith: '.column'
> > > > > });
>
> > > > > $(".column").disableSelection();
> > > > > });
> > > > >
>
> > > > > HTML:
> > > > >
> > > > >
> > > > > Feeds
> > > > > Lorem ipsum dolor sit amet,
> > > > > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, conse
[jQuery] Re: jQuery UI Portlets & Cookies
Thanks for this - but I don't understand where it would fit into my
script? I'm only just starting in jQuery...
Also, will this save the position of the portlet no matter which
column it's in? It's just that it looks like it's related to a closed
and expanded portlet state.
Thanks for your time.
Craig
On Oct 2, 2:58 pm, Nalum wrote:
> Hello Craig,
> I've done this before by building up a string e.g. box-
> id1,collapsed;box-id5,not-collapsed;box-id3,collapsed|box-
> id4,collapsed;box-id2,not-collapsed;box-id6,collapsed;
>
> In the javascript do something like thishttp://pastebin.com/m90a2af6
>
> Hope this helps,
> Nalum
>
> On Oct 2, 2:35 pm, craigeves wrote:
>
> > anyone?
>
> > On Oct 2, 12:08 am, craigeves wrote:
>
> > > Please can someone help?
>
> > > I am using the jQuery UI (sortable) Portlets code - but I want to use
> > > the jQuery cookies plugin to remember the order of the portlets. I
> > > don't know where to start - and searching the net for an answer only
> > > brings up sortable ul and li.
>
> > > Please help.
>
> > > Code:
> > >
> > > $(function() {
> > > $(".column").sortable({
> > > connectWith: '.column'
> > > });
>
> > > $(".column").disableSelection();
> > > });
> > >
>
> > > HTML:
> > >
> > >
> > > Feeds
> > > Lorem ipsum dolor sit amet,
> > > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > > elit.
> > >
> > >
> > > News
> > > Lorem ipsum dolor sit amet,
> > > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > > elit.
> > >
> > >
> > >
> > >
> > > Shopping
> > > Lorem ipsum dolor sit amet,
> > > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > > elit.
> > >
> > >
> > >
> > >
> > > Links
> > > Lorem ipsum dolor sit amet,
> > > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > > elit.
> > >
> > >
> > > Images
> > > Lorem ipsum dolor sit amet,
> > > consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> > > adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> > > elit.
> > >
> > >
[jQuery] Re: jQuery UI Portlets & Cookies
anyone?
On Oct 2, 12:08 am, craigeves wrote:
> Please can someone help?
>
> I am using the jQuery UI (sortable) Portlets code - but I want to use
> the jQuery cookies plugin to remember the order of the portlets. I
> don't know where to start - and searching the net for an answer only
> brings up sortable ul and li.
>
> Please help.
>
> Code:
>
> $(function() {
> $(".column").sortable({
> connectWith: '.column'
> });
>
> $(".column").disableSelection();
> });
>
>
> HTML:
>
>
> Feeds
> Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> elit.
>
>
> News
> Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> elit.
>
>
>
>
> Shopping
> Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> elit.
>
>
>
>
> Links
> Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> elit.
>
>
> Images
> Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
> adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
> elit.
>
>
[jQuery] Re: jQuery UI Portlets & Cookies
I have managed to find a script that will save the position of
portlets, but to one column only - plus it wont allow me to connect to
another column. I need to be able to drag over to other columns and
save their order. Can anyone help? Here is my code...
/
/ Set cookie for sidebar portlets //
/
// set the list selector
var setSelector = ".column";
// set the cookie name
var setCookieName = "portletOrder";
// set the cookie expiry time (days):
var setCookieExpiry = 30;
// function that writes the list order to a cookie
function getOrder() {
// save custom order to cookie
$.cookie(setCookieName, $(setSelector).sortable("toArray"),
{ expires: setCookieExpiry, path: "/" });
}
// function that restores the list order from a cookie
function restoreOrder() {
var div = $(setSelector);
if (div == null) return
// fetch the cookie value (saved order)
var cookie = $.cookie(setCookieName);
if (!cookie) return;
// make array from saved order
var IDs = cookie.split(",");
// fetch current order
var items = div.sortable("toArray");
// make array from current order
var rebuild = new Array();
for ( var v=0, len=items.length; v<len; v++ ){
rebuild[items[v]] = items[v];
}
for (var i = 0, n = IDs.length; i < n; i++) {
// item id from saved order
var itemID = IDs[i];
if (itemID in rebuild) {
// select item id from current order
var item = rebuild[itemID];
// select the item according to current order
var child = $("div.ui-sortable").children("#"
+ item);
// select the item according to the saved
order
var savedOrd = $("div.ui-sortable").children
("#" + itemID);
// remove all the items
child.remove();
// add the items in turn according to saved
order we need to filter here since the "ui-sortable"
// class is applied to all ul elements and we
only want the very first!
$("div.ui-sortable").filter(":first").append
(savedOrd);
}
}
}
// code executed when the document loads
$(function () {
$(setSelector).sortable({
update: function() {getOrder(); }
});
restoreOrder();
// here, we reload the saved order
$(".portlet").addClass("ui-widget ui-widget-content ui-
helper-clearfix ui-corner-all")
.find(".portlet-header")
.addClass("ui-widget-header ui-corner-
all")
.prepend('')
.end()
.find(".portlet-content");
$(".portlet-header .ui-icon").click(function()
{
$(this).toggleClass("ui-icon-minus");
$(this).toggleClass("ui-icon-plus");
$(this).parents(".portlet:first").find
(".portlet-content").toggle();
});
$(".portlet-header .ui-icon").hover(
function() {$(this).addClass("ui-icon-
hover"); },
function() {$(this).removeClass('ui-icon-
hover'); }
);
});
Header 1
fdssdsd
Header 2
fsdsdfsfsd
Header 3
fdsfsdfsdfsd
Header 4
Content 1 list
Header 5
Content 2 list
Header 6
Content 3
On Oct 2, 12:08 am, craigeves wrote:
> Please can someone help?
>
> I am using the jQuery UI (sortable) Portlets code - but I want to use
> the jQuery cookies plugin to remember the order of the portlets. I
> don't know where to start - and searching the net for an answer only
> brings up sortable ul and li.
>
> Please help.
>
> Code:
>
> $(function() {
> $(".column").sortable({
> connectWith: '.column'
> });
>
>
[jQuery] jQuery UI Portlets & Cookies
Please can someone help?
I am using the jQuery UI (sortable) Portlets code - but I want to use
the jQuery cookies plugin to remember the order of the portlets. I
don't know where to start - and searching the net for an answer only
brings up sortable ul and li.
Please help.
Code:
$(function() {
$(".column").sortable({
connectWith: '.column'
});
$(".column").disableSelection();
});
HTML:
Feeds
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit.
News
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit.
Shopping
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit.
Links
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit.
Images
Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit.
[jQuery] Re: Cookies
Sorry. Stupid me.
I want the script to remember the position of the divs and the
collapsible state.
Thanks
Craig
On Sep 28, 1:44 pm, Mike McNally wrote:
> It might help if you'd mention what it is you want to *do* with the plugin.
>
>
>
>
>
> On Mon, Sep 28, 2009 at 3:32 AM, craigeves wrote:
>
> > I'm really stuck in adding the cookies plugin to the sortables script
> > I have below. I don't even know where to begin. Can anyone help?
>
> >
> > $(document).ready(function(){
> > $(".column").sortable({
> > connectWith: '.column',
> > cursor: 'hand',
> > handle: 'h3',
> > opacity: 0.8,
>
> > change: function(e, i) {
> > // Post data back to server
> > or update cookie
> > }
> > });
> > $(".widget").append('<div
> > class="close"></div>');
> > $(".close").click(function(){
> > if
> > ($(this).parent().data("collapsed")=="yes") {
> >
> > $(this).parent().data("collapsed","no");
> >
> > $(this).parent().animate({height:$(this).parent().data
> > ("height")});
> > } else {
> >
> > $(this).parent().data("height",$(this).parent().height());
> >
> > $(this).parent().data("collapsed","yes");
> >
> > $(this).parent().animate({height:30});
> > }
> > });
>
> > });
> >
>
> > Many thanks in advance.
>
> > Craig
>
> --
> Turtle, turtle, on the ground,
> Pink and shiny, turn around.
[jQuery] Re: Cookies
I forgot to say that the script above is based on the JQuery UI
framework.
On Sep 28, 9:32 am, craigeves wrote:
> I'm really stuck in adding the cookies plugin to the sortables script
> I have below. I don't even know where to begin. Can anyone help?
>
>
> $(document).ready(function(){
> $(".column").sortable({
> connectWith: '.column',
> cursor: 'hand',
> handle: 'h3',
> opacity: 0.8,
>
> change: function(e, i) {
> // Post data back to server
> or update cookie
> }
> });
> $(".widget").append('<div
> class="close"></div>');
> $(".close").click(function(){
> if
> ($(this).parent().data("collapsed")=="yes") {
>
> $(this).parent().data("collapsed","no");
>
> $(this).parent().animate({height:$(this).parent().data
> ("height")});
> } else {
>
> $(this).parent().data("height",$(this).parent().height());
>
> $(this).parent().data("collapsed","yes");
>
> $(this).parent().animate({height:30});
> }
> });
>
> });
>
>
> Many thanks in advance.
>
> Craig
[jQuery] Cookies
I'm really stuck in adding the cookies plugin to the sortables script
I have below. I don't even know where to begin. Can anyone help?
$(document).ready(function(){
$(".column").sortable({
connectWith: '.column',
cursor: 'hand',
handle: 'h3',
opacity: 0.8,
change: function(e, i) {
// Post data back to server or
update cookie
}
});
$(".widget").append('');
$(".close").click(function(){
if
($(this).parent().data("collapsed")=="yes") {
$(this).parent().data("collapsed","no");
$(this).parent().animate({height:$(this).parent().data
("height")});
} else {
$(this).parent().data("height",$(this).parent().height());
$(this).parent().data("collapsed","yes");
$(this).parent().animate({height:30});
}
});
});
Many thanks in advance.
Craig
[jQuery] animate on page load
Hi all
Please can you help?
I want to animate the width of the 'progress_bar' div when the page
loads. I'm using the code below, which works fine in Firefox... but it
doesn't want to work in IE6.
Where am I going wrong?
Many thanks in advance
$(document).ready(function(){
$("#progress_bar").animate({
width: "250px",
}, 1500 );
});
[jQuery] Re: fadeIn and fadeOut divs
You are a genius... I think I read that somewhere else too, but didn't
take too much notice.
Cheers
C
On Sep 23, 11:44 pm, James wrote:
> fadeIn and fadeOut both takes a callback function (2nd parameter) that
> executes when completed:
>
> $("#latest_tweets").fadeOut(1000, function() {
> $("#weight_log").fadeIn(1000);
>
> });
>
> On Sep 23, 12:39 pm, craigeves wrote:
>
>
>
> > lease help...
>
> > What I need to do is simple.
>
> > When I click on .log or .tweets it fades out a div and fades in
> > another div. The problem I have though is that it fades in/fades out
> > at the same time causing a 'bump' in the animation effect.
>
> > I need the first div to fade out first, and only when that has faded
> > out completely can the second div fade in.
>
> > Here's my script.
>
> > Thanks in advance
>
> > C
>
> > Code:
>
> > $(document).ready(function(){
>
> > $("#weight_log").hide();
> > $("#selector").show();
>
> > $(".log").click(function () {
> > $("#latest_tweets").fadeOut(1000);
> > $("#weight_log").fadeIn(1000);
>
> > });
>
> > $(".tweets").click(function () {
> > $("#weight_log").fadeOut(1000);
> > $("#latest_tweets").fadeIn(1000);
>
> > });
>
> > });
[jQuery] fadeIn and fadeOut divs
lease help...
What I need to do is simple.
When I click on .log or .tweets it fades out a div and fades in
another div. The problem I have though is that it fades in/fades out
at the same time causing a 'bump' in the animation effect.
I need the first div to fade out first, and only when that has faded
out completely can the second div fade in.
Here's my script.
Thanks in advance
C
Code:
$(document).ready(function(){
$("#weight_log").hide();
$("#selector").show();
$(".log").click(function () {
$("#latest_tweets").fadeOut(1000);
$("#weight_log").fadeIn(1000);
});
$(".tweets").click(function () {
$("#weight_log").fadeOut(1000);
$("#latest_tweets").fadeIn(1000);
});
});
[jQuery] JQuery & Cookies
I would like to apply a cookie to this script so that I can return to
the page at a later date and it would remember my last action. Can
anyone help? Thanks in advance.
$(document).ready(function(){
$(".close").click(function () {
$("#welcome").fadeIn("slow");
});
$(".show").click(function () {
$("#welcome").fadeOut("slow");
});
$("a.toggle").click(function () {
$("a.toggle").toggle();
});
});
