Sliding Tabs Mootools 1.2

a place to get help

Moderator: 1.2 Moderators

Forum rules
  • Every time you need help create a new thread (but please use the search function before, as your problem maybe has already been solved)
  • use code highlighting (help)
  • After your problem has been solved you have to rename the subject to "[solved] <Topicname>" AND set the Topic icon as solved (the green check)

Re: Sliding Tabs Mootools 1.2

Postby ghazal on Sun Nov 23, 2008 11:25 am

YO!
This has been bugging me for a looooong time !
Your solution rocks !
Often a fresh eye (of the storm, :D ) does the trick.
TKS A LOT!
ghazal
mootools fan
 
Posts: 79
Joined: Sun Aug 10, 2008 3:28 pm

Re: Sliding Tabs Mootools 1.2

Postby theStorm on Sun Nov 23, 2008 11:29 am

now i'm trying to fix the initial-size-problem.

in the original version this is also buggy - at first time loading the page it shows shortly the whole panes...
don't know if i will have success there also ..
but i'll keep up trying..
theStorm
 
Posts: 9
Joined: Sat Nov 22, 2008 8:42 pm

Re: Sliding Tabs Mootools 1.2

Postby ghazal on Sun Nov 23, 2008 11:42 am

this one is almost ok in FF because I put all the regular/necessary files in head tag, which were not in the original.
Safari is still buggy re this pb.
ghazal
mootools fan
 
Posts: 79
Joined: Sun Aug 10, 2008 3:28 pm

Re: Sliding Tabs Mootools 1.2

Postby theStorm on Sun Nov 23, 2008 11:48 am

i can't follow you.
i have the problems in all browsers. where did you put which files?
theStorm
 
Posts: 9
Joined: Sat Nov 22, 2008 8:42 pm

Re: Sliding Tabs Mootools 1.2

Postby ghazal on Sun Nov 23, 2008 12:07 pm

Sorry. As I said, I am mac only.
FF , re the flicker pb, is the only browser ok. So, i guess the pb remains.
And the regular files are the usual suspects, css, moo-core, moo-more, slidingtabs.js
+ window.addEvent which was at the bottom in the original file.
ghazal
mootools fan
 
Posts: 79
Joined: Sun Aug 10, 2008 3:28 pm

Re: Sliding Tabs Mootools 1.2

Postby theStorm on Sun Nov 23, 2008 12:15 pm

i got it now.

i just inserted three lines in the changeTo-Function.

  1.  
  2. changeTo: function(element, animate) {
  3.     if ($type(element) == 'number') element = this.panes[element - 1];
  4.     if (!$defined(animate)) animate = true;
  5.     var event = { cancel: false, target: $(element), animateChange: animate };
  6.     this.fireEvent('change', event);
  7.     if (event.cancel == true) { return; };
  8.  
  9.     if (this.buttons) { this.buttons[this.current].removeClass(this.options.activeButtonClass); };
  10.  
  11.     this.current = this.panes.indexOf($(event.target));
  12.  
  13.     var oldHeight = this.outerSlidesBox.getStyle('height');
  14.     this.panes[this.current].setStyle('display','block');
  15.     var oldHeight = this.outerSlidesBox.setStyle('height', oldHeight);
  16.     
  17.     if (this.buttons) { this.buttons[this.current].addClass(this.options.activeButtonClass); };
  18.  
  19.     this.fx.cancel();
  20.     if (event.animateChange) {
  21.       this.fx.toElement(event.target);
  22.     } else {
  23.       this.outerSlidesBox.scrollTo(this.current * this.outerSlidesBox.offsetWidth.toInt(), 0);
  24.     }
  25.  
  26.     if (this.options.animateHeight)     
  27.         this.heightFx.tween('height',this.panes[this.current].offsetHeight);
  28.  
  29.   },
  30.  


you have to set the pane-style in your css-file to display:none in general, and in your html-file you have to overwrite it with display: block at this pane, which should be displayed at beginning. thats all. works for me like i need it.

can you check that on safari for me? thanks.

EDIT: damn, it sucks in IE7 - the scrolling doesnt work propper. but i have to sleep some hours now... ;-)

i'll keep it up.
theStorm
 
Posts: 9
Joined: Sat Nov 22, 2008 8:42 pm

Re: Sliding Tabs Mootools 1.2

Postby ghazal on Sun Nov 23, 2008 1:15 pm

Sleep well while its almost lunchtime here.
Results -
no Css changes:
Safari: no flicker, locally
but flicker online

+ CSS changes --> display:none/display:block
test online
FF : flicker again
Safari : on load, no flicker -but no text, but clicking back to "alpha", text reappears
ghazal
mootools fan
 
Posts: 79
Joined: Sun Aug 10, 2008 3:28 pm

Re: Sliding Tabs Mootools 1.2

Postby theStorm on Mon Nov 24, 2008 12:57 am

so. i'm ready.

i wrote a complete new little class. it has no options and no next / previews-functions. but it does the mainthing very well at opera/IE7/FF.
didn't test it on safari and everyone can extend or modify it on his needs.
works well with mootools 1.21.

http://att.dyndns.org/public/slidingTabs/

enjoy.
theStorm
 
Posts: 9
Joined: Sat Nov 22, 2008 8:42 pm

Re: Sliding Tabs Mootools 1.2

Postby Alekusu on Mon Nov 24, 2008 7:22 am

Mac : Safari/FF3 : OK

Thanks a lot theStorm and ghazal ! Your work is wonderfull ! :)

It's possible to get a version with options and next/preview options ? It will be very usefull.

theStorm > On your page, can you add a link to the original work (Sliding Tabs for mootools 1.11 by Jenna : http://creativepony.com/journal/scripts/sliding-tabs/ ) ?
Thanks a lot for her !
Alekusu
mootools connoisseurs
 
Posts: 39
Joined: Wed Sep 24, 2008 9:42 am

Re: Sliding Tabs Mootools 1.2

Postby theStorm on Mon Nov 24, 2008 8:08 am

sorry, i dont have the time for building next / prev inside.

i do not really need to link to jenna because my class is completely new...

maybe ghazal will build next / prev buttons.
theStorm
 
Posts: 9
Joined: Sat Nov 22, 2008 8:42 pm

PreviousNext

Return to Help

Who is online

Users browsing this forum: No registered users and 2 guests