Search jQuery

jQuery Forum

Screen name:
pshoeg

pshoeg's Profile

8 Posts

5 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

appendTo() and html()
[2Replies]
- 24-May-2010 03:00 AM
- Forum: Using jQuery
Hi there,

I want to insert a button with an onclick command using this code:
1. $('<li></li>').appendTo('#insertImg').html('<button onclick="document.execCommand('InsertImage',false,'http://stiern.com/site/wp-content/everything/weddinginv.png');")>Insert IMG</button>').addClass('success');
But I can't seem to make it work. What could the issue be here? It insert the button, but the onclick action doesn't work. I've tried like this as well:
1. $('<li></li>').appendTo('#insertImg').html('<button onclick="document.execCommand("InsertImage",false,"http://stiern.com/site/wp-content/everything/weddinginv.png");")>Insert IMG</button>').addClass('success');
I don't know if it has anything to do with the apostrophes or the quotation marks?

Lightbox causes textarea to lose focus
[2Replies]
- 23-May-2010 11:06 AM
- Forum: Using jQuery
Hi there,

I'm working on a WYSIWYG editor. I have a textarea that I'm using for the editing. Also, I have a button to insert images. When I click the button, a modal window opens, and the user can upload images, enter title, etc.

The problem is, that once I click inside the modal window, the textarea loses focus—and then the image can't be inserted at the cursor position. How do I prevent the textarea from losing focus?

Thanks,
Peter

Focus and blur
[1Reply]
- 20-May-2010 05:38 AM
- Forum: Using jQuery
Hi there,

Here's what I'm trying to do: When I click inside a text field, a div with id #formatting appears. The #formatting div contains... well, formatting options (like bold, italic, etc.) placed in <button> elements. When I click outside the text field the #formatting div has to disappear—unless the click is inside the #formatting div's <button> elements.
1. $("#textarea").focus(function() {
2. $('#formatting').slideDown(200);
3. });
5. $("#textarea").blur(function() {
6. $('#formatting').slideUp(200);
7. });
I was thinking about using an if statement, but can't seem to make it work.

Any ideas would be very appreciated.

Cheers.

Selectable
[2Replies]
- 19-May-2010 03:33 AM
- Forum: Using jQuery UI
Hi,

I'm playing around with the selectable feature. I grabbed most of this from an example. I want the background color of the selected element to change to red, but when I choose another element, the background color should return to original, and let the new selected element be red. How can I do this?
1. $(function() {
2. $("#selectable").selectable({
3. stop: function(){
4. var result = $("#select-result").empty();
5. $(".ui-selected", this).css("background","red");
6. $(".ui-selected", this).each(function(){
7. var bg = $("#selectable img").css('.hello');
8. var index = $("#selectable img").index(this);
9. result.append(" #" + (index + 1));
10. });
11. }
12. });
13. });

WYSIWYG editor in jQuery
[2Replies]
- 18-May-2010 05:46 AM
- Forum: Using jQuery
Hi there,

I'm building a WYSIWYG editor in jQuery, and right now I'm working on inserting links. I am using HTML5's contenteditable feature, that allows e.g. a div to be edited:
1. <div contenteditable="true"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></div>
When I select text, I want to click on a button, open a modal window, paste a link and click ok in order to insert the link. I have it working with a JavaScript prompt like this:
1. <button class="link" onclick="document.execCommand('CreateLink',false,window.prompt('Paste a link','http://'));"><img src="interface/images/link.png" alt="link" width="" height="" /></button>
Instead, because I want to be able to style the prompt, I want to use a simple modal window with a text field and a button inside.
1. <div id="link_panel">
2. <div id="link_wrapper">
3. <div class="modal_description"><h2>Link</h2><p>Past link or e-mail</p></div>
4. <div class="modal_file"><form name="linkform"><input type="text" name="linkurl" class="modal_link" /></form></div>
5. <div class="modal_submit"><button class="modal_insert_link" onclick="AddLink()">Insert link</button></div>
6. </div>
7. </div>
The problem is, that when I click inside the text field, the selected text in the contenteditable div becomes unselected, and I'm not able to insert the link.

Does anyone know how to handle this?

jQuery Health Meter / Progress Bar
[0Replies]
- 10-May-2010 07:05 AM
- Forum: Using jQuery
Hi there,

So, I'm creating a health meter with CSS and HTML.

I have two divs; the outer one is the background, and the inner one is the actual health. The outer div has a fixed width (let's say 200px), and the width of the inner div is set in percentage—thus, when it's 50%, it fills out 50% of the outer div.
2. <div id="outer">
3. <div id="inner"></div>
4. </div>
I'd like to be able to let the percentage number be a variable that can be targeted from jQuery, so that I can define the width from within jQuery.

The background color of the inner div should also change according to the percentage (green at 100%, yellow at 50%, red at 10%, etc).

How is this possible?

Div to disappear when clicking outside it
[3Replies]
- 21-Apr-2010 07:09 AM
- Forum: Using jQuery
So, I have a content div and a floating sidebar (that's draggable). When I click on the content div, I want another div (with id #formatting) to appear inside the sidebar. This is already working.

When I click outside the content div I want the #formatting div to disappear — but if I click inside the #formatting div it also disappears. How can I get it to stay there when I click inside the sidebar?

Should I use an if statement, or are there other options?
2. $('#content').focus(function() {
3. $('#formatting').show('fast', function() {
4. //
5. });
6. });
8. $('#content').blur(function() {
9. $('#formatting').hide('fast', function() {
10. //
11. });
12. });

Target all elements inside div except one...
[1Reply]
- 10-Apr-2010 03:05 AM
- Forum: Getting Started
Hi there,
I have this code in a js file:
1. $(document).ready(function(){
3. $(".accordion p").hide();
4. $(".accordion div").click(function(){
6. $(this).next("p").slideToggle("slow")
8. });
10. });
... and this code in my HTML file:
<div class="outer">
<div class="article_name">
<h2><a href="#">Should Comment Forms Have More Fields?</a></h2>
</div>
<div class="article_date">
Feb 11th 2010
</div>
<div class="article_category">
Discussion
</div>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
I'd like that when I click the outer div, p is shown (it's working). But I'd also like, that when the H2 link is clicked, p doesn't show - instead it should follow the link. How can I do that?
Thanks!

«Prev
Next »

Response title

Attachments

jQuery Forum

Activity Trend