pasz94

Forum Replies Created

Viewing 7 replies - 1 through 7 (of 7 total)
  • Thread Starter pasz94

    (@pasz94)

    Hi Manoj

    Thank you very much for your help. As soon as I deactivate the plugin called “Portfolio Filter Gallery” the problem disappears. It would be grat if you could solve the problem.

    Regards,
    Pascal

    Thread Starter pasz94

    (@pasz94)

    Thank you for your help. I’ll do that.
    The Portfolio Filter is a seperate plugin…

    Thread Starter pasz94

    (@pasz94)

    All right, I will do that in this way. Thanks for your help

    Thread Starter pasz94

    (@pasz94)

    Sorry, I changed the link. See in this link.

    https://

    • This reply was modified 7 years, 6 months ago by pasz94.
    Thread Starter pasz94

    (@pasz94)

    Yes this works, but it should open a new link by clicking over a chart. This works so far but when I change the view from text-editor to visual editor, wordpress changes the code. 

    <div class="image-container"><img src="https://imovatec.ch/wp-content/uploads/symbole/analyse.svg" alt="alternative" />
<div class="after">text1</div>
</div>

    The link <a href="https://imovatec.ch/kontakt"> disappears. That shouldn’t happen if I want to edit the page later in the visual editor.

    • This reply was modified 7 years, 6 months ago by pasz94.
    Thread Starter pasz94

    (@pasz94)

    okay, thank you. I could fix the problem. There is only one last thing. 

    <a href="https://imovatec.ch/kontakt">
<div class="image-container">
    <img src="https://imovatec.ch/wp-content/uploads/symbole/analyse.svg" alt="alternative"/>
    <div class="after">text2</div>
</div>
</a>

    It seems that this code isn’t correctly. Because by changeing from the text-editor to the view editor, wordpress change the code automatically, and after it doesn’t work anymore. Maybe the link href”” is wrong embedded. Do you see my error?

    With the css part I don’t have any problem now.

    .image-container {
    position: relative;
    width: 300px;
    height: 225px;
}
.image-container .after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    color: #FFF;
	text-align: center;
	padding-top: 100px;
  	font-size: 25px;

}

.image-container:hover .after {
    display: block;
    background: rgba(0, 0, 0, .6);
}
    Thread Starter pasz94

    (@pasz94)

    I think both isn’t working correctly. This is the page: https://imovatec.ch/kontakt/temp/

    In style.css I added: 

    <!DOCTYPE html>
<html>
<head>
<style>
.container {
  position: relative;
  width: 20%;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;a
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: rgba(231, 231, 231,0.4);
  
}

.container:hover .overlay {
  opacity: 1;
}

.text {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
</style>
</head>
<body>

</body>
</html>

    And on the page I added:

    <div class="container">
  <img src="https://imovatec.ch/wp-content/uploads/2017/08/IMG_3574-300x225.jpg" alt="Avatar">
  <div class="overlay">
    <div class="text">Offerten</div>
  </div>
</div>

    I don’t know a lot about html and css.

Viewing 7 replies - 1 through 7 (of 7 total)