Public Forums 71,145 posts

[diegop Friend diegopJoin date: June 2013Posts: 30Downloads:0Uploads:4 Thanks: 21]

#529581

Hi TomC, very thanks for yor lesson. That allright, but now appears a scroll in the left side!!! why???:-*

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#529584

<em>@diegop 420003 wrote:</em><blockquote>Hi TomC, very thanks for yor lesson. That allright, but now appears a scroll in the left side!!! why???:-*</blockquote>

Unfortunately, I would need to see the modification live – and resulting ‘scroll’ effect – to be able to try to assess the issue. When I just brought up your site (from your previously provided link above), I don’t see any modifications made.

[diegop Friend diegopJoin date: June 2013Posts: 30Downloads:0Uploads:4 Thanks: 21]

#533046

Hi Tom, here can you see what I meant. In the left side you can see the scroll, but it is like a photo…
http://www.mvdesign.es/index.php/quienes-somos
And the background not resize in responsive layout, what must I change for this?

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#533235

<em>@diegop 424512 wrote:</em><blockquote>Hi Tom, here can you see what I meant. In the left side you can see the scroll, but it is like a photo…
http://www.mvdesign.es/index.php/quienes-somos
And the background not resize in responsive layout, what must I change for this?</blockquote>

You can try to fix the problem with my solution below

Open templates/purity_iii/css/themes/negro/off-canvas.css file

Change


.off-canvas-effect-4.t3-off-canvas {
z-index: 1;
-webkit-transform: translate3d(-50%, 0, 0);
transform: translate3d(-50%, 0, 0);
}


To

.off-canvas-effect-4.t3-off-canvas {
z-index: 1;
/*-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(-50%, 0, 0);*/
}

Let me know if it helps

1 user says Thank You to Ninja Lead for this useful post

1. diegop

[diegop Friend diegopJoin date: June 2013Posts: 30Downloads:0Uploads:4 Thanks: 21]

#533661

hi Ninja Lead, you are a crack! The image of the scroll dissaperar!! I have another question! What code i need for making the texture (/hormigon.jpg) responsive? I see that in the mobile layer don´t resize well…

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#533721

Purity III template uses Bootstrap3 (BS3) which is fully responsive and automatically adapt to devise screen (desktop, tablet, mobile phone).

You can call element tags on (BS3) for your site, here is the list of all element tags for BS3: http://getbootstrap.com/css/

Image tag is supported too, but sometime you have to define new rule, for instance:

.img {
display: block;
max-width: 100%;
height: auto;
margin-left: auto;
margin-right: auto;
}

[kevinburk Friend kevinburkJoin date: January 2014Posts: 46Downloads:47Uploads:6 Thanks: 7 Thanked: 1 times in 1 posts]

#534462

<em>@TomC 419997 wrote:</em><blockquote>Here is where you can modify the background property for the middle/content area . . .

Within file path –> /templates/purity_iii/css/themes/negro/off-canvas.css
at line 53, you will see the following:


.t3-wrapper {
background: none repeat scroll 0 0 #0D0D0D
left: 0;
overflow: visible;
position: relative;
transition: transform 0.5s ease 0s;
z-index: 99;
}

Modify the “background” property for your chosen image – for example . . .


.t3-wrapper {
background-image: url("../../../images/your_image.png") none repeat scroll
left: 0;
overflow: visible;
position: relative;
z-index: 99;
}

Of course, you will need to identify the correct path for YOUR chosen background image.

</blockquote>

Just FYI, this code does NOT work. It’s missing a critical ; at the end of the background-image: url line, and the only way I could get this to work was to have that line read like this:

background-image: url(“../../../images/your_image.png”);

I spent a very, very frustrating hour troubleshooting this.

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#534554

@kevinburk: Right now its difficult to guess the issue and give solution to you. Please roll-back anything your changed on your site and send me the screenshot of problem and URL of your site. I will help you out

[kevinburk Friend kevinburkJoin date: January 2014Posts: 46Downloads:47Uploads:6 Thanks: 7 Thanked: 1 times in 1 posts]

#534640

@ninja Lead: I don’t think you understood my post. I was posting a correction to the code you suggested, which doesn’t work because it’s missing a semi-colon. It works just fine as long as you don’t leave that out.

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#534645

<em>@kevinburk 426633 wrote:</em><blockquote>@Ninja Lead : I don’t think you understood my post. I was posting a correction to the code you suggested, which doesn’t work because it’s missing a semi-colon. It works just fine as long as you don’t leave that out.</blockquote>

Sorry for missing that detail. Glad you were able to get things to work for you.

[omrigez Friend omrigezJoin date: April 2015Posts: 18Downloads:2Uploads:0 Thanks: 6]

#569193

Hi dieop!

How did you do the animation on the background image of http://www.mvdesign.es (which is moving slower then scrolling)?

It really cool!

Thanks!
Omrigez

[omrigez Friend omrigezJoin date: April 2015Posts: 18Downloads:2Uploads:0 Thanks: 6]

#734282

Hi dieop!

How did you do the animation on the background image of http://www.mvdesign.es (which is moving slower then scrolling)?

It really cool!

Thanks!
Omrigez

[Author]

Posts