jplayer appearance

If you have questions about using mojoPortal, you can post them here.

You may want to first review our site administration documentation to see if your question is answered there.

This thread is closed to new posts. You must sign in to post in the forums.

10/31/2013 3:35:40 PM

Ken Evans

Total Posts 77

View Posts

jplayer appearance

On my test website, the control row of bluemonday skin is distorted in that the sound control is aligned above the other controls.
This is increasing the vertical size of the control row.

The controls are aligned correctly on the pinkflag skin control but there are no control symbols above the four bars.

Lastly, after editing the style.config and reverting the code back to bluemonday, my site is still showing pinkflag.

What might I be doing wrong?

Thanks

Ken

11/1/2013 11:57:52 AM

Joe Audette

Total Posts 18439

View Posts

Re: jplayer appearance

Artisteer designs often produce css that has unintended consequences that create a need to fix css for various features by overriding some of the Artisteer css. We try to fix problems with the skins we ship but don't always notice every little problem. If you tell me specific skins we ship that don't display jplayer properly I'll try to look into it before the next release of mojoPortal. Unfortunately there is no way I can anticipate or prevent problems in custom skins that others produce either using Artisteer or from scratch.

When changing css for a skin either by editing css or changes in style.config you need to understand that the web browser caches it so after making any such change you need to reset the skin guid to make the browser load the latest version.

11/1/2013 2:29:34 PM

Ken Evans

Total Posts 77

View Posts

Re: jplayer appearance

Hi Joe,

The problem appears with the art41-wallpaper skin. I have not yet tested the others.

How do I "reset the skin guid" ?

Thanks

Ken

11/1/2013 2:39:11 PM

Ken Evans

Total Posts 77

View Posts

Re: jplayer appearance

Hi Joe,

I found out how to reset the guid by referring to your excellent documentation.

This is what jplayer bluemonday looks like in the art41-wallpaper skin.

http://sdrv.ms/17CeRWp

Thanks

Ken

11/2/2013 6:00:37 AM

Ken Evans

Total Posts 77

View Posts

Re: jplayer appearance

Hi Joe,

I tested all of the art41 skins with nivo slider bluemonday.
They all exhibit the same problems
- the sound bar is vertically offset from the player bar
- the amount of vertical space allocated to the controls is too much - it diverts attention from the playing video.

Here is a zip file that shows the results of my tests: http://sdrv.ms/HAtsac

Whilst I appreciate the effort that you have put in to integrate jplayer, I'm wondering if there is a way of offering a video player that has controls that only take up a thin and unobtrusive strip along the bottom of the playing image?

Ken

11/4/2013 12:10:12 PM

Joe Audette

Total Posts 18439

View Posts

Re: jplayer appearance

Hi,

I did some css spelunking and was able to isolate the part of the Artisteer css that was causing the problem.

If you add this in the style-artisteer-overrides.css and then reset the skin guid it should solve the problem:

.jp-playlist ul > li::before ,
ul.jp-controls > li::before ,
ul.jp-toggles > li::before
{ content: ''!important; margin:0 0 0 0; display: inline; }

Hope that helps,

Joe

11/4/2013 1:12:41 PM

Ken Evans

Total Posts 77

View Posts

Re: jplayer appearance

Hi Joe,

That was some great css spelunking you did!
It fixed the alignment problem - which makes jplayer useable (just about !)

I assume that I have to change style-artisteer-overrides.css in each style that I want to use - right?

Also, I still feel that the height of the jplayer control area is too obtrusive because it is too big - by a factor of three or so!
For example: look here to compare the height of the jplayer control area with that of the native windows MP4 player.

What are your thoughts on:
a) the possibility of reducing the height of the jplayer control area
or
b) using a different player for MP4? For example as mentioned: here and here

Ken

11/4/2013 1:44:14 PM

Joe Audette

Total Posts 18439

View Posts

Re: jplayer appearance

Hi Ken,

The style of the controls is determined by the designer who made the jplayer skin (ie blue monday). One can override it with more css or copy it and modify it to make a new skin.

I'm a developer not a designer so I include what is available and leave it to others if they want to change it but designing new skins for jplayer or modifying ones they provide is not something I'm inclined to work on. I have a huge list of things to do that are more of a priority for me.

In this case some artisteer css was interfering with the css of the jplayer skins and I added some css to cancel out what artisteer was doing so it would not affect the jplayer style.

If others want to contribute new skins for jplayer that would be fine with me but it isn't something on my to do list and doesn't hold much interest for me.

Best,

Joe

11/4/2013 3:51:29 PM

Ken Evans

Total Posts 77

View Posts

Re: jplayer appearance

Hi Joe,

Thanks for the clarification.
Like you, I have a long list of "to do's".

As I said, I can live with the existing jplayer skins.

However, I do need to brush up my CSS skills,so if I find the time, I'll have a look at making appropriate changes.

Ken

You must sign in to post in the forums. This thread is closed to new posts.