Hi Elisabeth,
In the current versions, css is used for the backgrounds. So to change the
background color for the themes, add css rules:
.timeline-band-0 .timeline-ether-bg{background-color:#eee}
.timeline-band-1 .timeline-ether-bg{background-color:#ddd}
(above are the default rules and their colors for the ether backgrounds).
Notes:
1) To find the default rules, see the source:
timeline/src/webapp/api/styles
2) Be sure to load your css file after the timeline-api.js file. That file
loads its css, so you need to overwrite the rules by adding afterwards.
3) Some of the css rules are broken or have other issues in v2.2. Ver 2.3
includes fixes. Ver 2.3 should be out real soon now (like this week.)
Regards,
Larry
________________________________
From: Elisabeth <[email protected]>
To: SIMILE Widgets <[email protected]>
Sent: Wednesday, March 4, 2009 12:32:16 PM
Subject: Re: Bar color for imprecise events
Hi Larry,
I changed to the new version of timeline, but I can't get any of my
customized colors (theme.ether) to show up anymore.
Here's how I'm trying to customize the theme:
var theme = Timeline.ClassicTheme.create(); //create the default
theme then customize it
theme.ether.backgroundColors[0] = "#fff6dc"; //top background color
theme.ether.backgroundColors[1] = "#ab5410"; //bottom background
color
This worked before. Also, the styles that have the word "ether" in
them don't work either.
.timeline-ether-marker-bottom {
color:#fff6dc;
}
.timeline-ether-marker-bottom-emphasized {
color:#1d2033;
}
Am I missing something obvious? (Here's the timeline:
http://calligraphyqalam.com/test/styles/index.html)
Elisabeth
On Mar 4, 11:39 am, Elisabeth <[email protected]> wrote:
> Thank you so much Larry - I've just updated my timeline and it's
> already looking better. I appreciate your help.
> Elisabeth
>
> On Mar 4, 11:30 am, Larry Kluger <[email protected]> wrote:
>
> > Hi Elisabeth,
>
> > To upgrade, I'd use one of the examples from the current release. Use it to
> > compare / change your file.
> > Current release is 2.2 and its examples are
> > here:http://simile-widgets.googlecode.com/svn/timeline/tags/latest/src/web...
>
> > Usehttp://static.simile.mit.edu/timeline/api-2.2.0/timeline-api.js
>
> > to access the library from your script.
>
> > Regards,
>
> > Larry
>
> > ps. Please let us know when we should add your Timeline to our In The Wild
> > wiki page.
> > Thanks.
>
> > ________________________________
> > From: Elisabeth <[email protected]>
> > To: SIMILE Widgets <[email protected]>
> > Sent: Wednesday, March 4, 2009 11:04:45 AM
> > Subject: Re: Bar color for imprecise events
>
> > Hi Larry,
> > Thanks so much for your response. I'm not concerned as much with the
> > opacity of the tape as the color; no matter what color I choose for my
> > event bar, the imprecise section of the event is still that same
> > blue.
>
> > What would be the best way to upgrade to the newest version of
> > timeline?
> > Thanks again,
> > Elisabeth
>
> > On Mar 4, 10:58 am, Larry Kluger <[email protected]> wrote:
>
> > > Hi Elisabeth,
>
> > > Welcome to Timeline.
>
> > > You're using an older version of Timeline. I believe the tape colors were
> > > controlled in that version explicitly through the theme object.
>
> > > Current version of Timeline uses css in many more places to control
> > > appearance.
>
> > > However, even in the current version of Timeline, the opacity of tapes is
> > > controlled via the theme to provide a standardized mechanism across
> > > browser manufacturers.
>
> > > Regards,
>
> > > Larry
>
> > > ________________________________
> > > From: Elisabeth <[email protected]>
> > > To: SIMILE Widgets <[email protected]>
> > > Sent: Wednesday, March 4, 2009 10:43:35 AM
> > > Subject: Bar color for imprecise events
>
> > > Hi! Does anyone know how to adjust the band color for Timeline events
> > > that have an imprecise duration?
> > > My timeline is here:http://calligraphyqalam.com/test/styles/index.html
> > > and you can see that the first event has a green bar, but for the
> > > imprecise dates the same bar is a shade of blue.
>
> > > My CSS file is here:http://calligraphyqalam.com/test/css/cqstyle.css
> > > My js file for the timeline is
> > > here:http://calligraphyqalam.com/test/styles/scripts/createtimeline.js
> > > My xml file is here:http://calligraphyqalam.com/test/styles/xml/data.xml
>
> > > Thanks so much!
> > > Elisabeth
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"SIMILE Widgets" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/simile-widgets?hl=en
-~----------~----~----~----~------~----~------~--~---
