WYSIWYG editor's button - javascript

I'm up to upgrade my "wysiwyg" editor by adding new buttons to the toolbar. One of these buttons is called "add a slideshow" which works this way :
when I click the button, it shows up a popup window which tells me to add pictures that are gonna be in the slideshow.
then when I choose the pictures, a simple slideshow will be created and shown in the editor.
I made some research in the net and I found an enormous number of slideshow codes that each time when you wanna change the slide, you have to go to html code and change the attribute's value ... So instead of that, I just wanna make it easier to the user by doing this "popup window + automatic add of the pic to the slideshow"
If anyone of you guys have an idea about this, please help me to achieve this work.
PS: Sorry for my poor English :p

The unfortunate thing about wysiwyg text editors is, while some have options, usually what you see is what you get.

Related

Multiple buttons function to expand and hide div section with javascript

Hope everyone is having fun on this fun (or frustrating šŸ˜‚ like me) coding day. So, I came across a problem and was hoping someone could help guide me to the right solution. I want to set it so that when I click on the ā€œread moreā€ button, it adds the ā€œactiveā€ class and would expand the paragraphs.
I was able to do a loop function for multiple buttons on the page, but when I click on one, it affects all the buttons. I know this is a looping problem but I have not figured out a way to solve it.
What Iā€™m trying to do is basically only have the button I click on add the class, without it working on all the buttons on the webpage. I intend to add more buttons to the page, so if anyone has a better solution or knows of a looping method (cause Iā€™m pretty sure the looping Iā€™m using is the wrong way), please help.
Please see the video for what I mean when I click on one button, both buttons get affected by it.

Change an url on an image depending on something checked before

I am trying to make an E-commerce website. I'm using Wordpress/Woocomerce.
But the guy I am working for, wanted special pages with a really special design. So he asked me for something that I did.
But now the fact is that I have a problem with the attributes and adding it to the cart button.
So I'd like to find a way to change the url on the "add to cart" button, which is an image.
Is there anyway to make an url on a page ( not in the search bar, but in the code ) change if u check or uncheck something ?
Like a radio button or anything.
Also I'm looking for a cool way to keep the selected size white once I clicked on. Actually it's just an image with an invert effect on hover . And I just found a way to make all work with 1 page per size but it would be really could if I could change the link on the add to cart button change. I just dont know how to change it.
Here is the link : http://mtcdistrup.cluster003.ovh.net/black-onyx/
As you can see, if u click on S it loads another page and on the new page the add to cart button links straight to the good product.
I hope all is clear and that u can help me a bit.

Need JS help- collapsing a toggled down element when another is selected

Need help with the "our team" section halfway down this page: http://dev.doubleaevents.com/
When you click an image it opens to reveal more information. I'd like to be able to click another image and have the previously opened image collapse, so that a user can't open more than one image at a time.
Would also like to know if making them slide out to the right (instead of down) would be a simple fix?
I'm a js novice so any explanations are appreciated. Here's the js file for quick reference: http://dev.doubleaevents.com/wp-content/plugins/portfolio-gallery/assets/js/view-toggle-up-down.js
Try adding this:
jQuery('.portelement').each(function(){
if(jQuery(this).hasClass('large')){
jQuery(this).removeClass('large');
jQuery(this).animate({
height:240
},300);
}
});
before:
jQuery(this).parents('.portelement').addClass('large');
In your javascript code.
When you click an item you basically want to search for elements that are already open. Then from there remove the 'large' class name and close that element. From there you continue on to opening the selected element. Thats what this code does.
As far as your other question, it shouldn't be too difficult, just mess around with the animate method and css. But maybe look into the isotope documentation. There may be an option for that.

How to organize overlapping javascript onclick events in overlapping divs

Especially on smaller screens like iPad and iPhone it happens that a click on a element does not only trigger the "onclick function of the actual script but also the "onclick" function of the javascript of the underlaying div.
On my homepage http://www.somersetsights.co.za/en/index.html for example on a iPad a click on the like button activates the FB Like dialog and a click on the OK button of this Like dialog triggers the start of a movie from the slideshow function underneeth the Like dialog.
I tried to find a solution by googling this problem but struggled to find something. I am not a beginner but I am also not a experianced javascript programmer. Help would be very much appreciated.
Peter
Maybe that could help you : http://www.quirksmode.org/js/events_order.html
Tell us if you use jQuery or another JS library.

Bookmarklet to select all friends and add them to an event on Facebook

I am trying to make a bookmarklet to allow me to select all my friends in the dialog to create an event on Facebook. Examining the source with Firebug shows the following:
The div container for each person gets a new class label of
selectedCheckable
when it it is clicked, So I have written this like of JS to try and select all the div's and give them this class:
$(".checkableListItem").addClass("selectedCheckable");
This works in selecting them, however when it comes time to press the "Save and close" button, the changes do not seem to have any effect in selecting all the friends to add to the event. It seems that FB has a different way of marking the friends that have been selected to add to the event. Would anyone be able to point me in the right direction so I can accomplish this? Thanks in advance, RayQuang :)
May I advise instead of making your own couldn't you just use one of these Greasmonkey scripts?
http://userscripts.org/scripts/search?q=facebook+invite&submit=
That's what I was doing and it was working for my events. Let me know if it works for you.

Categories