Joomla!NL - Textbox en image pop-up

Textbox en image pop-up

25 apr 2012 16:37

#1

Hallo!
Ik heb de volgende twee vragen:

In mijn commentbox (ik gebruik JComments) zie ik altijd dit:

Net of er een tekstveld in de textbox staat.. erg raar..?

Ook vraag ik of iemand van jullie een goede extensie heeft om van afbeeldingen een thumbnail te maken en als je erop klikt dat deze in een pop-up (op dezelfde pagina wel) opent.

Alvast bedankt!

refurb
Heeft onderwerp gestart
Nieuw op Joomla!NL
Berichten: 19

Textbox en image pop-up

25 apr 2012 16:43

#2

Of je gebruikt een verouderde versie van JComments, of er is een css conflict met je template.

Tip: maak gebruik van de Firebug-addon voor Firefox (links naar deze tool hier te vinden addons.mozilla.org/nl/firefox/addon/firebug/?src=search ). Met deze tool kun je o.a. van ieder onderdeel van de site de css definities achterhalen en waar en in welk bestand ze staan. Tevens kun je met deze tool in de betreffende pagina van je site veranderingen aanbrengen in de css definities en meteen zien wat het effect is (later evt. wel zelf de aanpassingen aanbrengen in css bestanden).

Of zet een link naar je site hier neer.

Graag voor je tweede vraag een nieuw onderwerp aanmaken, zo houden we het forum overzichtelijk en heb je meer kans op antwoord.

Groetjes, Astrid

Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725

Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Astrid
Moderator + Technisch team
Berichten: 37438

Textbox en image pop-up

25 apr 2012 18:55

#3

Code:

<textarea id="comments-form-comment" size="29" tabindex="65" rows="65" cols="65" name="comment"></textarea>

Is wat ik vind met Firebug, redelijk normaal dus. Ik heb dit probleem ook met bijv. contactformulieren. Dus het zal iets zijn in het template? Maar wat...

Ik gebruik Just BusinessFT

Bedankt

refurb
Heeft onderwerp gestart
Nieuw op Joomla!NL
Berichten: 19

Textbox en image pop-up

25 apr 2012 18:58

#4

En wat staat er bij de css van comments-form-comment?

Groetjes, Astrid

Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725

Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Astrid
Moderator + Technisch team
Berichten: 37438

Textbox en image pop-up

26 apr 2012 14:00

#5

Waarschuwing: Spoiler!

Code:

#comments {
    margin: 0;
    padding: 0;
    text-align: left;
    text-decoration: none;
    text-indent: 0;
    text-transform: none;
    width: 100%;
}
#comments a {
    background-color: inherit;
    color: #849B9F;
    font-weight: normal;
    text-decoration: none;
}
#comments a:active, #comments a:focus, #comments a:hover {
    background-color: transparent !important;
    color: #CC0000 !important;
}
#comments a[rel*="external"], #comments a[rel*="external"]:active, #comments a[rel*="external"]:hover, #comments a[rel*="external"]:focus {
    background: url("images/jc_link.gif") no-repeat scroll right center transparent;
    display: inline-block;
    margin: 0 2px;
    padding: 0 10px 0 0;
}
#comments .rss, #comments .refresh, #comments .subscribe {
    border: medium none;
    display: inline-block;
    margin: 0 2px;
    padding: 0 0 0 14px;
}
#comments .rss {
    background: url("images/jc_rss.gif") no-repeat scroll left center transparent !important;
}
#comments .refresh {
    background: url("images/jc_refresh.gif") no-repeat scroll left center transparent !important;
}
#comments .subscribe {
    background: url("images/jc_subscribe.gif") no-repeat scroll left center transparent !important;
}
#comments h4 .rss, #comments h4 .refresh {
    display: inline-block;
    margin: 0 0 0 5px;
    padding: 0 0 0 10px;
}
#comments-list-footer {
    margin: 0 0 10px 20px !important;
}
#comments-form-link .showform {
    background: url("images/jc_blog.gif") no-repeat scroll 0 -28px transparent;
    border: medium none;
    display: block;
    font-weight: bold;
    margin: 5px 0 0 22px;
    padding: 0 0 5px 14px;
}
#comments .comment-box {
    color: #999999;
    margin: 0;
    padding: 0;
}
#comments .comment-avatar {
    float: left;
    margin: 0;
    padding: 0;
}
#comments .avatar-indent {
    padding-left: 40px;
}
#comments .comment-anchor {
    border: medium none;
    color: #777777;
    text-decoration: none;
}
#comments .comment-author, #comments .author-homepage {
    color: #3C452D;
    font: bold 1em Verdana,Arial,Sans-Serif;
    margin: 0;
    padding: 0;
}
#comments .author-homepage {
    border-bottom: 1px dotted #3C452D;
    text-decoration: none;
}
#comments .comment-title {
    color: #B01625;
    font: bold 1em Verdana,Arial,Sans-Serif;
    margin: 0;
    padding: 0;
}
#comments .comment-avatar img {
    border: medium none !important;
    width: 32px;
}
#comments .comment-date {
    background: url("images/jc_date.gif") no-repeat scroll left center transparent;
    color: #999999;
    font-size: 10px;
    margin: 0;
    padding: 0 0 0 12px;
}
#comments .comment-body {
    color: #777777;
    margin: 6px 0 0;
    padding: 0 0 2px;
}
#comments .quote, #comments blockquote, #comments .code, #comments code, #comments pre {
    background-image: none;
    clear: both;
    display: block;
    margin: 5px 0 5px 10px;
}
#comments blockquote, #comments .hidden, #comments code, #comments pre {
    color: #849B9F;
    margin-bottom: 8px;
    padding: 8px;
    text-align: left;
}
#comments blockquote, #comments .hidden {
    border: 1px dashed #849B9F;
}
#comments code, #comments pre {
    border: 1px solid #DEDEDE;
    overflow: hidden;
    white-space: normal;
}
#comments .code {
    background: none repeat scroll 0 0 transparent;
    border: medium none;
    padding: 0;
}
#comments .quote {
    color: #777777;
}
#comments .hidden {
    clear: both;
    display: block;
    margin: 5px 0;
}
#comments .comments-buttons {
    float: right;
    height: 15px;
}
#comments .email, #comments .emailactive {
    border-bottom: 1px dotted #999999;
    cursor: pointer;
    font: 1em/10px Verdana,Arial,Sans-Serif;
    margin: 0;
    padding: 0;
    text-decoration: none;
    white-space: normal;
}
#comments .email {
    background-color: inherit;
    color: #444444;
}
#comments .emailactive {
    background-color: inherit;
    color: #CC0000;
}
#comments .email img, #comments .emailactive img {
    padding: 0;
}
#comments p {
    font: 1em Verdana,Arial,Sans-Serif;
    margin: 5px 5px 5px 0;
    padding: 0;
    text-decoration: none;
    text-indent: 0;
    text-transform: none;
}
#comments .comment-body img {
    border: 0 none;
    padding: 0;
}
#comments .comment-body .img {
    max-width: 500px;
    padding: 4px 0 !important;
}
#comments .toolbar {
    border-top: 1px solid #CCCCCC;
    clear: both;
    color: #CCCCCC;
    margin: 8px 0 0;
    padding: 5px 0 0;
}
#comments .toolbar a, #comments .toolbar a:hover {
    background-color: transparent !important;
    background-image: url("images/jc_toolbar.gif") !important;
    cursor: pointer;
    float: left;
    height: 16px;
    margin: 0 2px 0 0;
    width: 16px;
}
#comments .toolbar-button-edit {
    background-position: 0 0 !important;
}
#comments .toolbar-button-delete {
    background-position: 0 -16px !important;
}
#comments .toolbar-button-unpublish {
    background-position: 0 -32px !important;
}
#comments .toolbar-button-publish {
    background-position: 0 -48px !important;
}
#comments .toolbar-button-ip {
    background-position: 0 -64px !important;
}
#comments .toolbar-button-ban {
    background-position: 0 -80px !important;
}
#comments .comments-list {
    height: 1%;
    margin-left: 20px;
}
#comments .even, #comments .odd {
    background-color: transparent;
    background-image: none;
    border: medium none;
    color: #3C452D;
    margin-bottom: 10px;
    margin-left: 0;
    padding: 0;
}
#comments-list .comments-inline-edit {
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    color: inherit;
    margin: 5px 0;
    padding: 5px;
}
div.comments-policy {
    background-color: inherit;
    border: 1px dotted #CCCCCC;
    color: #777777;
    margin-bottom: 5px;
    margin-left: 20px !important;
    margin-right: 0;
    margin-top: 5px;
    padding: 5px;
    text-align: left;
    text-decoration: none;
    text-indent: 0;
    text-transform: none;
}
div.comments-policy ol, div.comments-policy ul {
    line-height: 5px;
    margin: 0;
    padding: 5px 0 0 20px;
}
div.comments-policy ol li, div.comments-policy ul li {
    border: medium none;
    font: 1em/5px Verdana,Arial,Sans-Serif;
    margin: 0;
    padding: 0;
}
#comments-form, #comments-form p, #comments-report-form, #comments-report-form p, #comments-form span, #comments-form .counter {
    text-align: left;
    text-decoration: none;
    text-indent: 0;
    text-transform: none;
}
#comments-form p, #comments-report-form p, #comments-form span, #comments-form .counter {
    color: #777777;
    font: 1em Verdana,Arial,Sans-Serif;
}
#comments-form p, #comments-form #comments-form-buttons, #comments-form #comments-form-error, #comments-form #comments-form-captcha-holder {
    font: 1em Verdana,Arial,Sans-Serif;
    margin-bottom: 8px;
    margin-left: 20px !important;
    margin-top: 10px;
    overflow: hidden;
    padding: 0;
}
#comments-inline-edit {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #CCCCCC;
    margin: 5px 0 0;
}
#comments-inline-edit #comments-form p, #comments-inline-edit #comments-form #comments-form-buttons, #comments-inline-edit #comments-form-error {
    font: 1em Verdana,Arial,Sans-Serif;
    margin-bottom: 2px;
    margin-left: 5px !important;
    margin-top: 5px;
    padding: 0;
}
#comments-form img.smile {
    border: medium none;
    cursor: pointer;
    margin: 0 3px 3px 0;
    padding: 0;
}
#comments-form img.captcha {
    border: 1px solid #CCCCCC;
    margin: 0 0 3px;
    padding: 0;
}
#comments-form span.captcha {
    background: url("images/jc_refreshg.gif") no-repeat scroll 0 2px transparent;
    color: #777777;
    cursor: pointer;
    display: inline-block;
    padding: 0 0 0 12px;
}
#comments-form label, #comments-report-form label {
    background-color: inherit;
    color: #777777;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
    vertical-align: middle;
}
#comments-form input, #comments-report-form input, #comments-form textarea {
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    color: #444444;
    margin: 0;
    padding: 0 !important;
}
#comments-form input {
    height: 1.5em;
    margin-bottom: 2px;
    width: 170px;
}
#comments-form input.selected, #comments-form textarea.selected {
    background-color: #FFFFE0 !important;
    border: 1px solid #849B9F;
    color: #777777;
}
#comments-form input.error, #comments-form textarea.error {
    background-color: #FFFFE0;
    border: 1px solid #FF0000;
    text-decoration: none;
    text-transform: none;
}
#comments-form input.checkbox {
    border: medium none;
    line-height: 1.5em;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    width: 16px;
}
#comments-form input.captcha {
    margin: 3px 0 5px;
    width: 116px;
}
#comments-form textarea {
    margin: 0;
    max-width: 400px !important;
    min-height: 200px;
    resize: none;
    width: 350px;
}
#comments-form-message {
    display: block;
    margin-right: 5px;
    padding: 5px 5px 5px 25px;
}
.comments-form-message-error {
    background: url("images/jc_error.gif") no-repeat scroll 4px 50% #FFD86F;
}
.comments-form-message-info {
    background: url("images/jc_info.gif") no-repeat scroll 4px 50% #DFEEFF;
}
#comments-form .counterpanel {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #EEEEEE;
    border-color: #DDDDDD;
    border-right: 1px solid #DDDDDD;
    border-style: solid;
    border-width: 0 1px 1px;
    color: #CCCCCC;
    display: block;
    height: 13px;
    margin: 0;
    max-width: 400px !important;
    overflow: hidden;
    padding: 0;
    width: 350px;
}
#comments-form .grippie {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: url("images/jc_resize.gif") no-repeat scroll right 2px #EEEEEE;
    border-color: #DDDDDD;
    border-right: 1px solid #DDDDDD;
    border-style: solid;
    border-width: 0 1px 1px;
    color: #CCCCCC;
    cursor: s-resize;
    display: block;
    height: 13px;
    margin: 0;
    max-width: 400px !important;
    overflow: hidden;
    padding: 0;
    width: 350px;
}
#comments-form .grippie .counter {
    font-size: 10px;
    margin: 0;
    padding: 0;
}
#comments-form .grippie span {
    display: block;
    float: left;
}
#comments-form .grippie span span {
    display: inline;
    float: none;
}
#comments-form .btn, #comments-report-form .btn {
    background: url("images/jc_btnl.gif") no-repeat scroll 0 0 transparent;
    float: left;
    margin-right: 5px;
}
#comments-form .btn div, #comments-report-form .btn div {
    background: url("images/jc_btnr.gif") no-repeat scroll 100% 0 transparent;
    float: left;
    margin: 0 -1px 0 0;
}
#comments-form .btn a, #comments-report-form .btn a {
    border: medium none;
    color: #777777;
    font-size: 12px;
    font-weight: bold;
    height: 22px;
    line-height: 22px;
    padding: 0 5px;
    text-decoration: none;
}
#comments-form .btn a:hover, #comments-form .btn a:focus, #comments-report-form .btn a:hover, #comments-report-form .btn a:focus {
    background-color: transparent;
    color: #0B55C4;
    text-decoration: none;
}
#comments-form-smilespanel {
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    cursor: pointer;
    display: none;
    left: 0;
    max-width: 200px;
    overflow: auto;
    padding: 2px;
    position: absolute;
    top: 0;
    z-index: 999999 !important;
}
#comments-footer, #comments-footer a {
    background-color: inherit;
    color: #CCCCCC !important;
    font: 9px Verdana,Arial,Sans-Serif !important;
}
#comments-footer {
    border-top: 1px solid #CCCCCC;
    display: block;
    height: 14px;
    margin-top: 4px;
    padding-top: 1px;
    text-align: right;
}
#comments-footer a {
    background: none repeat scroll 0 0 transparent !important;
    border: medium none !important;
    float: right;
    margin: 0;
    padding: 0;
    text-decoration: none !important;
    text-transform: none;
}
body #

Zie de CSS hierboven.

Sorry, ik had de HTML gepost.

refurb
Heeft onderwerp gestart
Nieuw op Joomla!NL
Berichten: 19

Textbox en image pop-up

26 apr 2012 16:18

#6

Kan het zo niet zien. Of zelf even goed zoeken met firebug, of hier een link naar je site plaatsen.

Groetjes, Astrid

Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725

Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Astrid
Moderator + Technisch team
Berichten: 37438

Laatste nieuws

Welkom bij Joomla!NL

Textbox en image pop-up

Textbox en image pop-up

Textbox en image pop-up

Textbox en image pop-up

Textbox en image pop-up

Textbox en image pop-up

Textbox en image pop-up

Laatste forumberichten

Wil je Joomla!NL steunen?