Jquery geen flauw benul van

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Jordi Kroon

Jordi Kroon

12/11/2010 15:01:02
Quote Anchor link
nou ik wil graag een tooltip op mijn website

je klikt dan op een smiley en dan krijg je een lijst met afbeeldingen
als je daar dan op klikt dan komt er in het textvlak de :P ( ubbcode ) te staan

maar ik heb mischien 1% verstand van jquery en het is toch noodzakelijk om het te gebruiken

kan iemand mij dan helpen
als je de relevante code nodig hebt dan zal ik het plaatsen
 
PHP hulp

PHP hulp

24/05/2024 09:21:51
 
Jel le

Jel le

12/11/2010 15:13:06
Quote Anchor link
Ik heb dit script voor je gevonden.
Deze voegt tekst toe op de plek waar je cursor zit in een textarea.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
$.fn.insertAtCaret = function (myValue) {
        return this.each(function(){
                //IE support
                if (document.selection) {
                        this.focus();
                        sel = document.selection.createRange();
                        sel.text = myValue;
                        this.focus();
                }
                //MOZILLA/NETSCAPE support
                else if (this.selectionStart || this.selectionStart == '0') {
                        var startPos = this.selectionStart;
                        var endPos = this.selectionEnd;
                        var scrollTop = this.scrollTop;
                        this.value = this.value.substring(0, startPos)
                                      + myValue
                              + this.value.substring(endPos, this.value.length);
                        this.focus();
                        this.selectionStart = startPos + myValue.length;
                        this.selectionEnd = startPos + myValue.length;
                        this.scrollTop = scrollTop;
                } else {
                        this.value += myValue;
                        this.focus();
                }
        });

};


Je roept hem zo op:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
$(document).ready(function() {
    $('a').click(function() {
        $('textarea').insertAtCaret('text');
    });
});


En hoever ben je al met het smiley lijstje?
 
Jordi Kroon

Jordi Kroon

12/11/2010 15:17:59
Quote Anchor link
niet ver omdat ik dit juist nodig hebt
 
Jel le

Jel le

12/11/2010 15:21:56
Quote Anchor link
Je kan het doen door een div te maken met daarin de smileys. Via css zet je die div op display:hidden;

Dan kan je met jquery $('.dediv').show(); doen.
Je kan dit natuurlijk ook animeren of er een toggle aan vast zetten.
 
Jordi Kroon

Jordi Kroon

12/11/2010 15:23:01
Quote Anchor link
zou jij dit er voor mij in willen zetten want ik begrijp er niks van ?

relevante code:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
<?php
//Deze functie hebben we later nodig voor de UBB code
Echo '
 <script language="JavaScript">

function ubb() {
    return;
}
function Invoegen2(ubb) {
    var edit;
    var HuidigeTekst = document.form1.news.value;
    edit = HuidigeTekst+ubb+" ";
    document.form1.news.value=edit;
    document.form1.news.focus();
    return;
}
</script>

 
'
;

?>


<?php
// Lees.php


    
 


// Database connectie maken met database

include('includes/conn.php');
include('includes/ubb.php');
// Alles uit db halen laatste bericht als eerste.
$sql = mysql_query("SELECT
                        *,
                        id
                    FROM
                        news
                    ORDER BY
                        id
                    DESC $pages->limit
                    "
);

// Als de query is gelukt
if($sql)
{

    // Als er items zijn
    if(mysql_num_rows($sql) > 0)
    {

        // Items neerzetten
        while($rec = mysql_fetch_assoc($sql))
        {

            // Alles echoën
            echo '<b>Naam:</b>   '.$rec['user'];
            Echo "<br>";
            echo '<b>Gepost op:</b> '.$rec['datum'];
            Echo "<br>";
                        Echo "<br>";
            echo nl2br('<b>Bericht: </b>'.ubb_gastenboek($rec['news']));
            
            // Lijntje
            echo '<br><hr><br>';
        }
    }

    // Anders
    else
    {
        // Geen berichten
        echo 'Er zijn nog geen nieuws berichten!.';
    }    
}

// Anders
else
{
    // MySql error
    echo 'Er is een fout opgetreden in de query: <br />';
    echo mysql_error();
}



# Als er is gesubmit
if( $_SERVER['REQUEST_METHOD'] == 'POST' )
{

    # Velden leeg check
if($_POST['user'] == "" )
    {

        $errors[] = 'Je bent je naam vergeten!';
    }

if($_POST['news'] == "" )
    {

        $errors[] = 'laat het veld news niet leeg !';
    }

    
if($_POST['news'] == "Typ hier je nieuws!" )
    {

        $errors[] = 'laat het veld news niet leeg !';
    }
    
    
    if( !isset( $errors ) )
    {

        $qry = "INSERT INTO
                    news
                        (
                         user,
                         news,
                         ip,
                         datum                        
                         )
                VALUES
                    (
                     '"
.mysql_real_escape_string( $_POST['user'] )."',
                     '"
.mysql_real_escape_string( $_POST['news'] )."',
                     '"
.$_SERVER['REMOTE_ADDR']."',
                     NOW()
                     )"
;
                    
        if( mysql_query( $qry ) )
        {

 Echo "Het nieuw is succesvol verwerkt, bedankt voor je inzending!";
     echo '
    <form action="" method="post">
        <label>Naam:</label>
        <input type="text" size="12" maxlength="12" name="user">
        <br />
        <label>News:</label>
        <textarea name="news" rows="4" cols="50">Typ hier je nieuws!</textarea>
        <br />
        <input type="submit" value="Post" name="Post">
    </form>'
;
        }

        else
        {

echo 'Foutjeee :( ' . mysql_error( );
        }
    }

    else
    {
        foreach( $errors as $error )
        {

            echo  $error.'<br />';
        }
    }
}

else
{
    # Het formulier


    


?>



<table>
<TR><TD>
<a href="javascript:ubb();" onClick="javascript:Invoegen2('[b][/b]');">
<img src="http://www.phphulp.nl/img/icon/editor/bold.gif" width="16px" height="16px" border="0">
</a>

<a href="javascript:ubb();" onClick="javascript:Invoegen2('[i][/i]');">
<img src="http://www.phphulp.nl/img/icon/editor/italic.gif" width="16px" height="16px" border="0">
</a>

<a href="javascript:ubb();" onClick="javascript:Invoegen2('[u][/u]');">
<img src="http://www.phphulp.nl/img/icon/editor/underline.gif" width="16px" height="16px" border="0">
</a>

<a href="javascript:ubb();" onClick="javascript:Invoegen2('[s][/s]');">
<img src="http://www.phphulp.nl/img/icon/editor/strikethrough.gif" width="16px" height="16px" border="0">
</a>

<a href="javascript:ubb();" onClick="javascript:Invoegen2('[img][/img]');">
<img src="http://www.phphulp.nl/img/icon/editor/image.gif" width="16px" height="16px" border="0">
</a>

<a href="javascript:ubb();" onClick="javascript:Invoegen2('[quote][/quote]');">
<img src="http://www.phphulp.nl/img/icon/editor/quote.gif" width="16px" height="16px" border="0">
</a>

<img src="http://www.mafiaway.nl/images/smilies/smilesmile.gif">
</TD></TR>

</table>

<?php
    echo '
    
    <form name="form1" action="" method="post">
        <label>Naam:</label>
        <input type="text" size="12" maxlength="12" name="user">
        <br />
        <label>News:</label>
        <textarea name="news" rows="4" cols="50">Typ hier je nieuws!</textarea>
        <br />
        <input type="submit" value="Post" name="Post">
    </form>
'
;
}

    
    





?>


alvast bedankt :)
de smilies kan ik zelf wel maar het javascript lukt mij niet
 
- Dave -

- Dave -

12/11/2010 15:27:17
Quote Anchor link
Wat begrijp je niet? Wat heb je zelf al geprobeert?
 
Jordi Kroon

Jordi Kroon

12/11/2010 15:31:45
Quote Anchor link
nou hoe zou ik het zeggen
ik heb eigenlijk nog nooit iets met jquery gedaan dus ik heb die code

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<script language="JavaScript">
$.fn.insertAtCaret = function (myValue) {
        return this.each(function(){
                //IE support
                if (document.selection) {
                        this.focus();
                        sel = document.selection.createRange();
                        sel.text = myValue;
                        this.focus();
                }
                //MOZILLA/NETSCAPE support
                else if (this.selectionStart || this.selectionStart == '0') {
                        var startPos = this.selectionStart;
                        var endPos = this.selectionEnd;
                        var scrollTop = this.scrollTop;
                        this.value = this.value.substring(0, startPos)
                                      + myValue
                              + this.value.substring(endPos, this.value.length);
                        this.focus();
                        this.selectionStart = startPos + myValue.length;
                        this.selectionEnd = startPos + myValue.length;
                        this.scrollTop = scrollTop;
                } else {
                        this.value += myValue;
                        this.focus();
                }
        });

};
</script>


die moet ik dan bovenin zetten? bij de andere of is dit al fout
en hoe moet

en dan hoe moet ik ervoor zorgen dat het werkt op de smiley van regel 184

dat is hetgene wat ik niet begrijp
ik denk dat ik het via<div> moet doen maar hoe pas ik het toe
Gewijzigd op 12/11/2010 15:32:10 door Jordi Kroon
 
Wouter J

Wouter J

12/11/2010 15:37:09
Quote Anchor link
Je hebt niet verplicht jQuery nodig! jQuery is slechts een javascript libary, dus met alleen javascript kun je het ook. Je kan daarnaast ook een tooltip maken met css.

Hier heb ik wat voorbeeldjes gemaakt van jQuery tooltip, met de tooltip functie:
http://waldio.110mb.com/js/tooltip.html
Je kan ook een tooltip makkelijk zelf maken met jQuery:
http://waldio.110mb.com/js/jQuery/tooltip_image.html

[PS]Wil je misschien precies uitleggen wat je wilt? Want dan kan ik wel even een jQ code voor je maken
Gewijzigd op 12/11/2010 15:38:05 door Wouter J
 
Chris -

Chris -

12/11/2010 15:43:23
Quote Anchor link
Grappig dat jij je plaatjes van phphulp vandaan haalt ;-)
 
Jordi Kroon

Jordi Kroon

12/11/2010 15:43:38
Quote Anchor link
je klikt op de smiley :

dan verschijnt er onder die smiley een soort balkje waar allemaal smileys op staan

dan kan je met je muis over die balk gaan waar de smileys in staan
dan klik je op die smiley die je wilt en dan komt hij in de textbox te staan

dan komt er dus een :P tekentje of een :B

Toevoeging op 12/11/2010 15:44:38:

ja klopt ik haal de plaatjes van phphulp omdat dat zegmaar de plaatjes van de bb codes zijn
 
Vincent Huisman

Vincent Huisman

12/11/2010 18:05:42
Quote Anchor link
dit is heel makkelijk te maken.

je hebt je plaatje met een linkje voor je smiley.
je hebt een divje met alle smileys.

dat divje verstop je als je de pagina binnenkomt (display: none;). wanneer een persoon op het linkje klikt, dan laat je het divje zien mbv js
 
Jordi Kroon

Jordi Kroon

12/11/2010 18:18:45
Quote Anchor link
en als diegene nog een keer klikt moet het weer weggaan;'
 
Vincent Huisman

Vincent Huisman

12/11/2010 18:46:32
Quote Anchor link
dan maak je een var aan, bijv:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var toggle = 0;

if(je klik detectie ding)
{
    if(toggle == 0)
    {
        // laat je het divje zien
        toggle = 1;
    }
    else
    {
        // laat het divje weggaan
        toggle = 0;
    }
}
 
Wouter J

Wouter J

12/11/2010 21:25:27
Quote Anchor link
@Vincent, dat heeft in jQuery gewoon een functie: togglo
 
Vincent Huisman

Vincent Huisman

12/11/2010 21:37:23
Quote Anchor link
kan ook, maar zo kan je zelf kiezen welk effect je wil, fade, show/hide en slide up/down. en het kan op deze manier ook zonder jquery
 
Wouter J

Wouter J

12/11/2010 21:39:47
 
Bas IJzelendoorn

Bas IJzelendoorn

13/11/2010 00:59:20
Quote Anchor link
@ TS zie PM![/modedit]

Ontopic:

Jquery heeft ook documentatie, lezen is leren.
Gewijzigd op 13/11/2010 00:59:37 door Bas IJzelendoorn
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.