Jaspal
Posts: 0
Joined: Wed May 13, 2015 9:10 pm

How to change Navbar Image on page load event?

Hi,

I applied below CSS on my nav_bar home button

[dsid=nav_bar_home]:after {
background: url('../image/Home.gif')no-repeat;
background-size: 25px 25px;
height: 25px;
margin-left: -15px !important;
width: 25px;
}

i want change home button image on my Home Page Load event.

I have tried below Jquery on page load but it did not work
Apperyio("nav_bar_home").find('after').addClass('HomeActive');

CSS
.HomeActive {
background: url('../image/HomeActive.gif')no-repeat;
background-size: 25px 25px;
height: 25px;
margin-left: -15px !important;
width: 25px;
}

Serhii Kulibaba
Posts: 150
Joined: Tue Aug 27, 2013 1:47 pm

How to change Navbar Image on page load event?

Hello Jaspal,

Please use "Page show" event instead of "Load". Navbar is not ready when Load event fires.

Jaspal
Posts: 0
Joined: Wed May 13, 2015 9:10 pm

How to change Navbar Image on page load event?

I tried on page show event it's not working

Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

How to change Navbar Image on page load event?

Hi Jaspal,

Please try following CSS code instead of yours:

pre

[dsid=nav_bar_home].HomeActive:after {
background: url('../image/HomeActive.gif')no-repeat;
background-size: 25px 25px;
height: 25px;
margin-left: -15px !important;
width: 25px;
}

/pre

Then use following JS code:

pre

Apperyio("nav_bar_home").addClass('HomeActive');

/pre

Regards.

Jaspal
Posts: 0
Joined: Wed May 13, 2015 9:10 pm

How to change Navbar Image on page load event?

Thanks Yurii Orishchuk !!!!!

Jaspal
Posts: 0
Joined: Wed May 13, 2015 9:10 pm

How to change Navbar Image on page load event?

can you please tell me how can i change Active navbar text color
Here is my CSS it's not working
[dsid=nav_bar_nav_bar_home].HomeActive:after {
background: url('../image/HomeActive.gif')no-repeat;
background-size: 25px 25px;
height: 25px;
margin-left: -15px;
width: 25px;
color:#000000;
}

Return to “Issues”