I don't know how to write a jQuery plugin BUT I had some funny ideas and developed some kind of "workaround" regardless my lack of skills :D I tried to Google a lot, but I can't realize the correct search string to find what I'm looking for.
Now, my plugin is "working" but I was wondering if somebody can enlighten me to make it look "better", with a properly written code.
You'll probably laugh after I show you what I've done so far , but please, take in mind I'm newbie and I'm just experimenting.
http://jsfiddle.net/Frondor/9za22/
In that jsfiddle you can see I didn't know how to handle "options" for calling dynamic content by the plugin like
var settings = $.extend({
icono: "/images/icon_69.png",
nombre: "Custom name"
}, options );
(Although I don't know what this code does xD But I think that plugins' options should look like these)
but instead of that, I've used an <i></i> (HTML) element as "options holder" with data-attributes in which my script is "looking" for options in order to show another HTML element (let's call it an "alert") which contains dynamic content depending on the data stored in the attributes previously configured inside the <i></i> tag.
If there is not any <i> tag in the page, then no "alert" will be shown.
So
I was wondering if someone can give me a hand to write this "plugin" properly xD With options like this kind of plugin does.
Thanks in advance!
Related
I am a newbie with html and i need your support. Please look at my code:
https://fiddle.jshell.net/ghLoau6r/1/
Now I want to make a list of FAQs as table. The requirements are:
when we click to any link button (here we have 2 link buttons as 2 rows of the table), the background must be changed (not pink anymore, but another color)
when we click to any link button, the triangle at the beginning of the row also changes to another form (i created already but my code does not run)
when we click "show info 2", the corresponding "content 2" should be shown, instead of "content 1" now.
please help me, thank you guys very much !
So, not to be rude but there is so many things that need to be fixed here, that I don't have time to share them all with you. I'd strongly recommend picking up a book (HeadFirst HTML & CSS isn't bad, there are plenty others) and getting a solid understanding before continuing the work.
That said, the core problems to your specific question are that first, ID's should be unique (you have two elements with the ID of 'content1'). Second, your second link is looking for content1 still, even though you want content2. A quick fix would be to update the ID of the second content area ,and then update the anchor onclick handler to look for the correct ID.
That said, this is pretty far from an ideal or scalable solution, so please read up.
As commented, I think it will be hard to help without completely writing it for you. But I'd like to at least point out that you should move your JavaScript from inline/in the HTML into a separate JS file.
In your JS Fiddle, take this:
onclick="document.getElementById('content1').style.display=(document.getElementById('content1').style.display=='none')?'block':'none'"
And put it in the "JavaScript" section of JS Fiddle, inside of a $(document).ready() function. Use jQuery to register the onclick event to the behavior you want. Can include jQuery in your fiddle by using a jQuery URI such as https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js
Godpseeed
How are you guys doing?
I am recently doing applying CKEditor to my corp's editor.
It's been great though I've got stuck in some problem.
I expect it to be the best even when we paste other contents from web or Word, but What blocks me doing is something kind of inline style tag, such as 'p style....' since it won't take its style away that my viewer doesn't seem to keep the same form.
I found out that filter.js would be the perfect solution for it. But there doesn't seem to be any way I can handle in my IDE since it doesn't exist.
How can I find a file called 'filter.js' or other plug-in so that I can handle the other way. this is the URL which would be help.
http://docs.ckeditor.com/source/filter.html#CKEDITOR-filter
Thanks.
Do I have to make new file called filter.js so I can edit on my own.
So confused. Hope to get some nice solution to it. Thanks.
CKEditor has a robust content filtering system called ACF (Advanced Content Filter). Read more about it here: http://docs.ckeditor.com/#!/guide/dev_acf and see the samples here: http://sdk.ckeditor.com/samples/acf.html. It's highly flexible so you can customize it to your needs.
I'm trying to accomplish something that might be relatively simple, but I don't know what I would call it (if there is a specific name for it), hence my searches have proved useless.
What I'm trying to accomplish is simple: I have a page built off off the Masonry jquery plugin (similar to http://designshack.net/tutorialexamples/masonry/demos/masonry.html). All I want to do is that when I click on a specific picture, it creates a "box" that fills up part of the screen and can contain another webpage (to describe the picture) while fading out most of the background. Then when I click outside of the box, it returns to all of my pictures.
I've seen this before, as I'm sure everybody else has, but for the life of me I cannot remember an example to look at or how best to do this. I don't have too much experience with javascript or jquery (which is why I'm asking this), but any help to point me in the right direction, whether it is using javascript or html/css, would be great.
If anybody does get the gist of what I'm describing and can explain it better, then you're more than welcome to edit..
What you need are modal windows.
I know the twitter bootstrap has built a pretty good framework for this:
http://getbootstrap.com/javascript/#modals
If you aren't using the bootstrap directly you might be able to pick out what you need.
Does anyone know how to style the new Disqus 2012 plugin? I believe it is pulled onto your website via an iFrame. I want to know if you can target specific classes via jQuery and change the properties after that.
You may view an example here: http://www.iamaaron.com/beta-five/consistent.html
I cannot target any of the Disqus elements through jQuery... Am I doing this wrong? Here's is my jQuery code:
jQuery("#disqus-thread .publisher-anchor-color a").css({color:"#36B1BF"});
Thank you!
Unfortunately you can't. All you can do is provide basic css and it'll take on that. If you change your a to something it'll interpret that. I've done some hackery to hide the buttons up top for example using a negative value for margin-top. You can't change anything through jQuery though because it's an iFrame not on your server. I know it's not the answer you were looking for but it's the answer.
Search this page for "css" and you'll see what I mean.
http://help.disqus.com/customer/portal/articles/526768-introducing-disqus-2012-and-f-a-q-
I was wondering how one could create something that resembles a textfield, but can contain html elements in it. For example, something like what Stackoverflow uses for tags on its "Ask Question" page. Can this be done this done using a particular plugin/library or does it need to be created from scratch?
I have seen some solutions using the "contenteditable" property, but I am worried about cross browser compatibility. In fact it would appear that the Stackoverflow example does not use this. I have tried searching for info on how to do this but haven't found anything. Would be grateful if someone could point me in the right direction.
You don't need to create it from scratch. Here is the one I use: TinyMCE
You might also find this useful. But you dont need to make a new one. There are a plenty of open source options available.