#>jQuery

[mournstera]

Sevens — a minimalistic and responsive, single-column theme

Static previews: - Preview (1) - Preview (2)

Download code: GitHub

This is a single-column Tumblr theme with a sidebar (header or right or left positioning), with a Google fonts of your choosing. Full support of npf posts. Optional dark/light mode toggle available.

Theme guide - click to browse all the features and/or read a thorough guide to this theme.

[eossa]

Featured Posts without jQuery?

So, you might know this amazing tutorial right here by @fukuo about making a featured posts section with the Tumblr API and jQuery.

Given that we're all kind of try to move away from jQuery, I thought, would it be possible using vanilla JS only? I tried converting it by myself first but — after reading a StackOverflow thread on how to convert jQuery's "getScript()" to vanilla JS — I realized that I lack the knowledge to do that (and not need ages for the conversion). Instead, I decided to use different online converters and check if the JS looks valid and doesn't contain traces of jQuery still; I ended up using this converter here. The result can be seen here (just the script).

However, when I use this script, there is no result at all and the featured posts are not being displayed. The code analysis on CodePen tells me that "Uncaught TypeError: document.querySelector.getScript is not a function", which brings me back to the aforementioned StackOverflow thread that made me feel like the huh? cat.

I did try @eggdesign's featured tags code as an alternative but either I'm incapable of running even that one or it is simply not compatible with @mournstera's base code, which I'm using.

If anyone has ideas on how to fix the converted code to make it work, I'm glad to hear your suggestions, it can only get better and I thank you in advance for offering your time and skill to help.

TL;DR: I'm once again losing the fight against the boss (JS + jQuery) and I'm handing the controller (bad code) to a cousin (incredible people on this site) to beat him.

[elumish]

My brother: when programming, if you're having trouble getting something to work, think through the logic of what you're trying to accomplish

Me: the logic isn't the problem. jQuery is the problem

[skinsbyoctober]

From crude mock-ups in photoshop to a finished-enough something, the sculpting process in skinning kind of looks a little like this for me. Its responsive-ish, which is pretty cool for someone who doesn't really have an interest in responsive design.

See how the mark-up for it is done on my codepen here. Design inspired by this little thing I saw on pinterest.

[trickinabucket]

i made this gay dumb bullshit (affectionate)

I couldn't immediately find some sort of node that allowed copying and pasting raw code with the click of a button, so I made one!

The icon is from fontawesome (so you can download a massive collection if u want) and can easily be replaced by another icon on the css page. The layout itself is fully customizable, but this one currently has classes added to the divs that automatically get themed with any jquery ui theme. It's resizable. All libraries you need don't need downloading, as google hosts jquery libraries and cdn hosts jquery ui themes. Pretty sure they also host fontawesome, but if they don't, you can get the links to the code on the fontawesome site.

What I'm most proud of is: You can have as many of them on the page as you want! The only limit is...well...ur computer? lol. What I mean by that is: copy and paste the divs that are a "blueprint", and the script will automatically add IDs/images necessary to keep everything all lined up. Every panel can be copied individually.

There's an indication as to whether copying was successful, as well.

Still have to do mobile testing, to see if the button works on devices, but after that, I'd be happy to share. It's not a plugin, per se (I still have yet to figure out how to make those), but I'm thinking abt making it into a regular ol Javascript function that you can still just plug in values.

Gonna take my afternoon nap firsttttt

[josegremarquez]

replaceAll() y replaceWith()

Sustituir Elementos en jQuery. Introducción En el desarrollo web, la capacidad de sustituir elementos del DOM de manera dinámica es esencial para crear interfaces interactivas y fluidas. jQuery, una biblioteca JavaScript altamente popular, ofrece dos métodos poderosos para sustituir elementos: replaceAll() y replaceWith(). Estos métodos permiten a los desarrolladores reemplazar elementos…

[divinector]

Animate On Scroll

[armornick]

Here's some perspective for the people getting fatigued by the constant new-framework hype in the frontend world;

jQuery is still the most-used JavaScript library at 94%.

WordPress still powers 43% of all websites.

You don't have to follow every trend, no matter what anyone says. Just keep using the technology you like to use and try something else if something actually looks better.

[codenewbies]

Product Carousel Slider

[freak-phone]

Your music page is so cool! Do you think you'd put out a template for it?

thanks! I do hope to do so, but the code needs quite a bit of tweaking to be user-friendly. it Works but it's very cobbled together.

[antirepurp]

oh No am i going to have to learn even more javascript shit to implement a navigation menu that i doesn't require me to update every page with said menu manually every time i add a page. say it ain't so stack overflow i beg of you

[mountmortar]

i love it when federal sites haven't updated their code since like. 2003 or something

[codingflicks]

Scroll To Top Button using HTML CSS JS

[peekaboorpg]

omg j'ai enfin dompté forumactif messenger pour qu'il fasse ce que je voulais + j'ai réussi à faire un affichage différent pour la zone des téléphones sans passer par le mode blog qui marchait pas avec messenger du coup

[innocence-wont-save-you]

some form of the triple affirmative has been found:

i have escaped my can and i am capable of travel to the void sea but i am unsure about the working conditions of other iterators and are currently attempting to help collapsed iterators off their rails to ascend -udg

OOC: Hi! You seem to have mistaken this blog for a roleplay blog. Innocence Won't Save You is interactive fiction, which is a different thing! The basic gist is that the players read the current story, then suggest things for Innocence to do. They're currently holed up in an old distillation building with a scavenger they're chatting with :)

While I appreciate the attempt to interact with this blog, I can't use this as an action, so I'll be discarding this ask. I will take the time to tell you a bit more about IWSY though, because why not? We're currently in status update 13, with scene 14 on the horizon. Innocence left their can, killed a Miros bird with an explosive spear they made, then made a lance with its beak. They're now on their way to Pebbles' can, and are roughly at Pebbles' edge of their shared farm sector. All players are realized in the game as Innocence's overseers, who suggest things for them to do that they may or may not actually do depending on how they feel about the suggestion. Most of the time, people have been submitting actions by sending in asks, but comments and reblogs also work!

I will also note that IWSY will be moving off of Tumblr with the advent of scene 14. To the anon that sent in another ask earlier: Very sorry, but you can't play on the site yet :') I'm still learning Javascript and figuring out how to set up commenting functionality, but you can continue to send in asks on this blog for the time being. The story just won't be updated concurrently on the blog. You can always read the latest updates on the official IWSY website, and I highly recommend that you get used to reading on the website for when I (finally) figure out how to let people comment on scenes there.

If you have any questions, feel free to ask! Thank you for interacting :)

[trickinabucket]

Regarding the Datatables Plugin for jQuery (and raw JS)

[Plugin here]

I figured out a way to get links in a table via the source spreadsheet. I'm not sure if there's another way that's better than this method, but, it's what I did.

So, here's what the end result datatable looks like vs its information.

As you can see, I have 2 more columns on the source sheet than I do the display sheet. That's because I didn't designate a column for them, but the plugin still has access to that information.

Meet: Linkit! [Demo] [jQuery.net Page]

LinkIt requires the word that needs to be automatically linked and the target URL. Which is what I have in those last 2 columns.

Linkit was used within the datatables function (in the callbacks), so it had access to the words I needed to link.

And, yeah, that's all well and good, but it only works for 1 link per cell. Otherwise, it just won't work.

Wellll, today, I figured it out!

I wanted to try and tackle this sort of thing eventually, and this was the perfect opportunity. How did I do it? A vanilla JS loop. That's probably not surprising, but you might be a little at a loss as to where to put it and how to execute it. At least, you would be if you're as inexperienced as I am.

Just after a conditional statement (verifying if the URL data exists) with the row and column within the loop.

There may be a method using each, with simpler syntax. Here's the thing: I'm absolutely terrible at getting those functions right. They reduce me to tears. So, this is definitely not gonna be the only approach. Just keep in mind that the row/column part will end up inside of the loop.

Also: DataTables is still being updated, though the LinkIt script was last touched like a decade ago. There are many plugins that do the same thing, however, so you might wanna use those if you get stuck using the one I suggested. EDIT: Have some code I made to make a list out of stuff in a cell.

Separated each "chunk" I wanted in a list with specific brackets (that I know I won't use later in the strings ever, you can do it w any 2 characters u want tho), and used this data rendering technique above. It separates the string into a list (well, more technically speaking, an array) by cutting sections off by the delimiter (the first square bracket, in this case.) Then, I knock off the one at the end. "Trim" gets rid of whitespace (space marks) at the beginning and end of a string, so that there's no chance I'll have a URL that's screwed up with an accidental space.