Are you able to see the coding of a Javascript function on a webpage your viewing? Is there a way using Google Chrome DevTools for example?
Specifically, I want to figure out how to code something like this
!Example 1
from this page
http://www.indeed.com/cmp/Bruce-Productions/jobs/Graphic-Designer-0a8d9cff06bf2790
Thanks in advance for any help!
Yes there is a way to look at all of a webpages html, Javascript files, and CSS using Chrome.
Open up the page in chrome, right click on the page and select inspect element (or press ctrl+shift+I).
From there you can navigate the different elements on the the page and the structure of the HTML file.
To get at the Javascript and CSS files switch over to the sources tab and look through the folders on the left to find the file you are looking for.
A word of warning, depending on the site the code that they are using may be minified (most all of the white space removed, and lots of variable names and other things shortened) or otherwise very difficult to read. If you are looking to do something more specific then I would recommend searching for that, or posting a question regarding that problem.
If you want to view the Javascript code, you can right-click the page, then select Inspect, then navigate to the javascript line by highlighting or selecting that line with .js extension and then position your pointer in the .js file, right-click & select Reveal in Sources panel.
In the browser you do right click to open a menu and select "View Source Code". Then you can read or save that page to analyze the content for any image or script.
But your question is so generic maybe you should try something basic and try to builds thing from there. Otherwise make a more specific question of what you want to do.
You can check it by opening the inspector in your browser and selecting the "coverage" menu. Then click on the "type" column until you find the .js files.
It is pretty much it, but you can read more details here: https://developer.chrome.com/docs/devtools/coverage/
Related
I want to fetch this site
https://www.film-fish.com/modern-mindless-action
to fetch the IMDB IDs of all movies listed there.
The problem is that the page loads all movies listed there just after scrolling down. So, a simple wget doesn't work.
Even if I scroll to the bottom of the page and view the source code, I do not see the last movie in the list (Hard Kill (2020)).
So the problem seems to be that the content is being created via JavaScript.
Has anybody a tip on how to achieve that?
So the problem seems to be that the content is being created via a js
script. Has anybody a tip on how to achieve that?
Indeed, executing JavaScript code is beyond scope of GNU Wget. You would need browser automation tool. If you know some Node.js or JavaScript I suggest taking look at PhantomJS Quick Start, Page Automation. Please take look at first example in 2nd link, you should be probably able to rework to your needs, i.e. instruct page to scroll down using JavaScript then extract what you need using JavaScript.
We are just setup a SharePoint Server 2019 and created several site collections. We first remove the top left element of the suite bar in .css or .js. I am not sure where did I remove the suite bar.
However, we would like to bring it back to all site collections. I tried to edit the SuiteNav.CSS COREV15.CSS and the master page css file, but no luck to bring it back (Please refer to the Reference Image).
Reference Image
I use f12 to check the class and found this part is totally missing from my site collection.
<div class="o365cs-nav-topItem o365cs-nav-o365Branding o365cs-rsp-tn-hideIfAffordanceOn"><a class="o365button o365cs-nav-appTitle o365cs-topnavText" role="heading" href="https://<spsite>/_layouts/15/sharepoint.aspx" id="Sites_BrandBar" aria-label="SharePoint"><span class="o365cs-nav-brandingText">SharePoint</span></a></div>
Can someone let me know how to fix it or how to reset the suite bar setting/config file to default. Thanks a lot~
You can find the CSS attribute of the corresponding element and the location of the CSS file in effect in the style window of the developer tools.
Pay special attention to：display:none.
If no CSS that does not display the element is not found, find all the js files that work on the current page in the developer tools.
After you find your custom js file, click to view the source code.Then you can debug the code, find out the effective code, and upload the modified code to the corresponding location.
Is there way, in Atom, to open files that are mentioned in comments?
When I edit a code file, there are often other code files of interest that I may want to also open while working on that file. Sometimes these reference files are miles away and require numerous steps of navigation to open them via the left-pane tree structure.
I was thinking, it would be nice if I could put relative file paths into javascript comments in a manner that atom would understand that if I click that path it should open that file in a new tab.
I suspect this isn't an original idea, so I'm hoping someone can direct me to a solution that enables this type of functionality or make me aware of how it is already enabled but I must use some syntax I'm not currently using.
I found open-project-file and it seems like a nice fit.
Update: I tested it and it works great! You just click on the relative path (whether it is located in code or comment) and by hitting ctrl-shift-o it immediately opens the file in a new tab within the atom editor.
I am currently running Clearbox JS on my site so that users may view a larger version of an image once they have visited the images page. Now, I just recently implemented this and I have noticed that on every single page at the top of the page Clearbox JS echos the command that it is doing. Whether it be initializing, or viewing an image, or event rotating an image. I really do not want this message popping up at all. I would much rather being required to put a link somewhere on the website to the developers website then having to deal with this. If anybody knows how to remove this, please answer. I am providing a link to the website so that you know what I am doing as well as a pastebin link to the clearbox.js file which is the config file.
website: www.dsdwebdesign.net/bootstrap_apgnew/index.php
pastebin: http://pastebin.com/NgBgc34X
Try this somewhere in your page, or the cb_style.css file (but make sure you read their conditions, I am not sure if you are allowed to do this with this piece of software):
#CB_OSD{
display:none!important;
}
It should hide the box at the top.
For some reason when I add a HTML module (well the default module added to DNN 5.4) and then add the "AddThis" javascript. While the button shows up clicking on it opens up a new page rather than showing an iframe modal message or on hover a list of popular social media networks to share the page with. Wonder what would be the easiest way to resolve this and why this happens?
This is not a complete answer, but to me it sounds like the AddThis javascript code is never loaded by the browser. When viewing the web page that doesn't workg, open the HTML source and look for the AddThis script tag. It probably should look something like this:
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=..."></script>
If you can not find it, then there is something to work on. If you find it, try to open the URL in your browser and see if you get the javascript.
Otherwise: as always, FireBug (or the tools in IE8) is your friend.
Try copying the addthis script reference and pasting it to the page header tags:
http://s7.addthis.com/js/250/addthis_widget.js#pub=AddThis