Page Background and translucent items on forfolio grid

I’d love you to have a look, I’m just working on the front page style, the content of portfolio single pages isn’t sorted out yet. http://ccrasa.com.
As I’m still experimenting, parts that may end up transparent may have a solid fill, and visa versa.

I want to build a page with an animated gif background , and some boxes (links) float in from the sides or ease in a ‘sexy’ way. The Layer Slider is absolutely amazing, but on smaller screen sizes it would shrink down and the selectable links and the text on them would be miniscule. That’s why I’m trying the portfolio grid.

Thanks for the plugin link. I installed but maybe my server didn’t meet the requirements stated, as I only got the first admin screen. so, I tried the plugin “Background Manager” but I got “requires PHP version 5.3.0 or better, but version 5.2.17 was detected“. A quick chat with the hosts’ techies and they updated the php version.
Now that I’m using Background Manager I have placed a test background image on the front page. The plugin you suggested allowed (required) the naming of the div to which the background would be applied, which sounds great, maybe my hosting will catch up one day. The requirements for that one were “PHP 5.2.4 + and MySQL 5.0+. In addition your hoster/server must allow/support the php eval() function and must support the wp_remote_get() and cUrl function” Perhaps they would upgrade all of those other bits also but I haven’t asked as I’ve found the solution I needed with the other plug-in.
At first the background only appeared below the footer as the divs above it must have had a white background. I tried identifying these divs in FireBug and giving them transparency with rgba color values but I was failing. I then went to the Styling section of the Theme Options. It came flooding back to me from customising Propulsion how the color boxes don’t accept the typing of rgba, but if you paste it there it stays. The only difference is that Propulsion gave control over the degree of transparency, whereas Enfold is looking at any rgba value and making it totally transparent. It also came flooding back how the automatically generated text colours become very wierd once you have applied some rgba values.

I need to identify divs to see if I can apply partial transparencies from the Child Theme css, and also control the wild colours that are coming up. I received great help from you last time in identifying these divs.

I also needed to make some space between the portfolio grid entries so that a little more of the background would show through.
Interesting is that when I give .grid-entry a margin (I did it in the Quick CSS facility) .grid-entry {margin:15px ;} it only creates a space below but not to the left or right of the grid entries.
In the end I made the graphic on the grid-entries (portfolio featured image) with a surrounding transparent area.

I need to lose the drop shadow on .grid-entry but I’m not sure how to do that. I’ve tried .grid-entry { border-style: none; } but it seemed that there wasn’t a border anyway, just a drop shadow.

Last thing would be to have the text boxes on the portfolio entering the page or easing in way that’s a bit ‘sexy’ with a script. Do you any tips here please, I’m pretty new to animating stuff.

Thanks
Tim

• This reply was modified 11 years, 1 month ago by KingConga.