2019. 03. 05.Videó | Vízjel eltüntetése képről Photoshop-ban
2018. 05. 12.Videó | Kép élénkítése Photoshop-ban
2018. 05. 05.ColorCop színlopó program
2018. 04. 30.Coppermine | Kép és fájlméret megadása az indexképek alatt
2018. 04. 24.Coppermine | Thumbnails képek méretének változtatása egyszerűen
Coppermine Gallery themes

Coppermine Gallery themes
532 napja
1392 néző

WordPress themes

WordPress themes
533 napja
411 néző

G-Portál themes

G-Portál themes
533 napja
165 néző

Tumblr themes

Tumblr themes
533 napja
227 néző

Szöveg a kép mögött 3.

Ez is egy olyan szövegdoboz, ha a képre viszed az egeret, akkor jelenik meg a benne lévő tartalom, ami lehet üdvözlő szöveg, Chat, Facebook doboz, stb.
 

Annyi hátránya van ennek a doboznak, hogy csak úgy simán nem lehet középre igazítani sajnos. Legalábbis én nem jöttem erre rá. Egy középre igazított táblázatba tettem bele a kódot és így a modulban középen helyezkedik el :) A táblázat miatt  a G-Portálosoknak a szövegdoboz betűtípusánál kell az !important is a kódsor végére, ahogy a kódban is látjátok!
 

Demó

 

Donec lectus sapien, dignissim vitae est non, aliquam suscipit velit. Pellentesque ac ligula tincidunt, elementum tortor eu, mattis dolor. Praesent quis hendrerit odio, sed scelerisque risus. Sed at vulputate velit, eget rutrum est. Duis et elementum libero. Curabitur eu libero sodales eros aliquam sagittis sit amet sit amet odio. Vivamus lorem nisl, varius sit amet vehicula blandit, mattis tempus mi. Donec lectus sapien, dignissim vitae est non, aliquam suscipit velit. Pellentesque ac ligula tincidunt, elementum tortor eu, mattis dolor. Praesent quis hendrerit odio, sed scelerisque risus. Sed at vulputate velit, eget rutrum est. Duis et elementum libero.


Navigáció
 

 

 

Szövegdoboz kódja
 

<center>
    <table align="center" border="0" cellpadding="0" cellspacing="0">
        <tbody>
            <tr>
                <td>
                    <div class="container">
                        <img alt="" src="/images/scripts/image-effects/001.png" />
                        <div class="textbox">
                            <p class="text">
                                Donec lectus sapien, dignissim vitae est non, aliquam suscipit velit. Pellentesque ac ligula tincidunt, elementum tortor eu, mattis dolor. Praesent quis hendrerit odio, sed scelerisque risus. Sed at vulputate velit, eget rutrum est. Duis et elementum libero. Curabitur eu libero sodales eros aliquam sagittis sit amet sit amet odio. Vivamus lorem nisl, varius sit amet vehicula blandit, mattis tempus mi. Donec lectus sapien, dignissim vitae est non, aliquam suscipit velit. Pellentesque ac ligula tincidunt, elementum tortor eu, mattis dolor. Praesent quis hendrerit odio, sed scelerisque risus. Sed at vulputate velit, eget rutrum est. Duis et elementum libero.</p>
                            <center>
                                <p>
                                    <br />
                                    <strong>Navigáció</strong><br />
                                    &nbsp;</p>
                                <div class="tabla">
                                    <div class="sorok">
                                        <div class="cellak">
                                            <p>
                                                <a href="ide jön a menü linke">Menüpont</a></p>
                                        </div>
                                        <div class="cellak">
                                            <p>
                                                <a href="ide jön a menü linkje">Menüpont</a></p>
                                        </div>
                                    </div>
                                    <div class="sorok">
                                        <div class="cellak">
                                            <p>
                                                <a href="ide jön a menü linkje">Menüpont</a></p>
                                        </div>
                                        <div class="cellak">
                                            <p>
                                                <a href="ide jön a menü linkje">Menüpont</a></p>
                                        </div>
                                    </div>
                                </div>
                            </center>

                        </div>
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
</center>


CSS kód
 

<style type="text/css">
.container {
    position:relative;
}
.container .textbox {
    background-color: #000000;
    width:400px;
    height:465px;
    border-radius:5px;
    -webkit-box-shadow: #ffffff;
    box-shadow: 0px 0px 15px 2px #ffffff;
    position:absolute;
    top:0;
    left:0;
    -webkit-transform: scale(0);
    transform: scale(0);
    filter:alpha(opacity=60);
    -moz-opacity:0.6;
    opacity: 0.6;
}
.container:hover .textbox {
    -webkit-transform: scale(1);
    transform: scale(1);
}
.text {
    font-family: Arial !important;
    font-size: 13px !important;
    color: #B9B9B9 !important;
    text-shadow: 1px 1px 1px #000000;
    text-align: justify;
    line-height: 19px !important;
    padding: 10px;
}
.textbox { /* ez felel azért, ahogy megjelenik a szövegdoboz, ha ráviszed az egeret */
    -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;
}
.tabla{
    display: table;
}
.sorok{
    display: table-row;
}
.cellak{
    width: 170px;
    background: #DA5B58;
    display: table-cell;
    padding: 10px;
    border-top: 1px solid #B9B9B9;
}
.cellak a:link, .cellak a:visited, .cellak a:hover{ /* link kinézete */
    color: #000000 !important;
    font-family: Arial !important;
    font-size: 13px !important;
}
</style>


2 453 megtekintés

Hozzászólások