Hi,

I use Dreamweaver still. Only because I used it since it came out in late 90s and been using it since then even though i use it as a notepad, ignoring all those buttons and gadgets. You got a mac, so you can use Coda2 which isn’t made for windows, a good IDE.It’s all a waste when working with WordPress though, or at least I never could get comfortable with any of it.

All animations you see today are jQuery and CSS powered, with css taking over more and more. As soon as ie8 and ie9 browsers die, can hopefully do it all in next generation css. like less or sass which fuse css with a scripting language so can use logic.

The easiest way to animate anything is by using a css selector and then an identical selector but this time with :hover at the end. You can put one image for hover, and another image for normal view, and as soon as a mouse hovers above the image or letter, or any html tag, can get css to do something.

Those glyph icons can be animated any way you want with css which you are starting to understand. The problem is that you cant dynamically switch classes or id’s in the html code on a live site using css alone. or changing a link destination with css alone. So graphics people are today forced into learning javascript, which despite the name is a serious language when compared to php. So there you have it.

Thanks,

Nick

Hi,

If you are interested I wrote yesterday some deep stuff about css media queries and the cascade .. counterfeiting and the cascade. https://kriesi.at/support/topic/responsive-problem#post-120098

—

You can have, and if gallery has a unique id assigned to it as some advanced elements do, then its a piece of cake, if it doesn’t than it takes a bit more trickery to target them. Basically you will need to look at each one in relation to the html tags in front of each of them, and see if there is any differentiation you grasp and use. You can always go into the code and manually add an extra css tag via php. However if in some situations its almost impossible to do, there are really complex css selector targeting like .. target 3rd paragraph after 2nd div that comes after an image class for which you have a class name. stuff like…ul li:nth-child(3) { }

You can examine some low level advances targeting here http://devsnippets.com/article/5-advanced-css-pseudo-class.html

The page is called like that because you took too long to give it a title, so since wordpress auto-saves revisions, it saved itself under that name so when you added a title the slug itself remained the page ID. To change it , you need to change the slug since there is no law that your page slugs must match page titles. To turn on slugs, http://www.clipular.com/c?8102009=detVhaytfA8MCcl1vMBSHRGYFek&f=.png just open the top panel in pages and posts and portfolio items and click the slug check box. Just remember rules of slugs: no spaces, only small letters, and can use minus sign – and underscore _ (minus sign is standard in place of spaces). And slug should not be more than 60 characters long. 0-9 a-z _ + only.

—-

Damnn. I think u can win best enfold site , i know best one i seen, and I look at em all day and twice on Sunday (thats today). I should have copied your css from your previous attempts, what a waste.

—-

any reason you got a white vertical line separating the sidebar i guess on the page you linked from last post?

—

I don’t think the calendar works. Somethings wrong with it.

—

I just looked and you are in luck. avia-gallery-1 and avia-gallery-2 are in play. Here is css for avia gallery 1 already changed and an identical set would be needed for gallery to so just change 1 to 2 in each selector. You may have some selectors from avia-gallery though that you wont be able to kill since their specificity may be higher, so those will require aditional css, though try this.

#top div .avia-gallery-1 {

overflow: hidden;

padding-bottom: 2px;

clear: both;

}

#top .avia-gallery-1 .avia-gallery-thumb a {

float: left;

width: 20%;

opacity: 1;

display: block;

}

.main_color .avia-gallery-1 img {

background-color: #24444E;

color: #E6D9CF;

}

#top div .avia-gallery-1 img {

float: left;

border-style: solid;

border-width: 1px;

padding: 7px;

width: 100%;

border-radius: 0;

}

#top .avia-gallery-1 .avia-gallery-thumb a:hover {

opacity: 0.5;

}

.avia_transform .avia-gallery-1 img.avia_start_animation {

-webkit-animation: avia_appear 0.9s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);

-moz-animation: avia_appear 0.9s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);

-o-animation: avia_appear 0.9s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);

animation: avia_appear 0.9s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);

opacity: 1;

}

.alternate_color .avia-gallery-1 img{

background-color: #305F72;

color: #E6D9CF;

}

don’t forget, make 2nd copy with -2 instead of -1 if you want the 2 gallerys different.

—

i thought before u wrote u are in late 60s , u 3 years older than me and not 70.

Nick

Hi P,

I’ll put it on my to-do as I finally have quite a few video requests to take care of. So far, I’ve noticed its best to actually use images instead of text for the Layer Slider as the images are better at being responsive than pure text.

Regards,

Devin

Hi,

Here are the font color, background color, and border color for the left icon box. You can take out the things you dont care about, and ofcourse change the colors.

/*---background color, font color, border color of the icon---*/

.iconbox_left .avia-font-entypo-fontello {

background-color: #00F;

color: #FFC0CB;

border-color: #FFF;

border-style: solid;

border-width: 1px;

}

/*background color, font color, border color of the icon box*/

.iconbox_left .iconbox_content {

background-color: #3F0;

color: #000;

border-color: #383731;

border-style: solid;

border-width: 1px;

}

/*title font color in icon box*/

.iconbox_left .iconbox_content_title {

color: #FFF;

}

2. Please provide a url to your website in order to remove that space. An image will not help. Need to see code. If it exists on the demo please provide url kriesi.at/themes/enfold the page url where this takes palce.

3. Please watch video https://vimeo.com/64927356 on how to update. If you customized your templates, you should use http://www.winmerge.org to compare the update to your current modified theme on a line by line basis to see the differences and update the parts you want. then use ftp .

Thanks,

Nick