Hide browse button inside file input - css

So far I managed to make my upload button act like a file input but now I don't want the browse button anymore and unfortunately I don't know how to get rid of it.
Any ideas?

The best idea for fixing this would be to create a custom file input. This might seem painful at first but is the best way to have full control over your file input design.
Look at https://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/ for one of the ways to do this.
Another way involves an ugly work around that is widely used. The thread for the following is Hide the browse button on a input type=file

Related

How to create a text area which takes styles

I am writing an application, the use case is admin can enter some text in text area, the same will be displayed to the logged in user.
Here my problem is, if admin copies some code from some editor like eclipse/ intelliJ IDE, the code and style also should get copied to the text box.
So that user would be able to see it in proper format/style.
Is there any way to achieve this?
Thanks and Best Regards,
Kishna
Unfortunately that is not possible.
The textarea is not designed for that purpose.
Read here for further information.

plonetruegallery: Download link or button, so users can download a viewed image?

I use collective.plonetruegallery for image galleries within Plone and I like it. However, what I miss is a "download" button or a simple "link" in order to let users actually download a image. The "Galleria" display view of plonetruegallery does seem to offer such a link/button -- does any of the other display views? Or any other solution whithout having to hack the plonetruegallery addon myself?
I know that you can right click and then choose "download image" among several other options within your preferred browser -- however, for a dumb user to cumbersome ;)
I have added an option to collective.ptg.contactsheet (1.1.2) that let you choose between going to the content or downloading it.
Espen
There's not a built-in "feature" to do this. You can see which of the gallery views might have this; looks like you've already found one. I'm sure you could easily customize another one to include such a link, simply by following the example in Galleria.
This is quite easy to make. The url to download the image would probably be:
/path/to/image/download
One option could be to just add an action.
If you want to have this for a specific gallery, I can probably fix it.
(go to https://github.com/collective/collective.ptg.contactsheet or whatever gallerytype you want it for and add an "Issue"
Espen

Inline CSS editing and Live Preview

I am NOT after anyone to code this, I am after some advice and possibly links to similar system, that we may learn from
I have searched long and hard, but had no luck. What I am wanting to do is:
Have a webpage with two panes. Demo image below.
Upper Pane: holds a CSS file, like a textarea. User can edit and save as they go. With a Preview button below..
..which onclick shows a preview pane or modal window. With the css changes to a particular file.
I suppose its a bit like JS fiddle, but it preloads a specific css file.
The Preview pane has a specific html file loaded. So that when user saves the session updates the css file, and they can se their progress.
I know this isnt a question in the strictest sense, and perhaps before voting down you may just assist with some pointers to similar scripts .. or logic. As it is I have had no luck finding anything that can do this, let alone knowing where to start to create something like this.
Another one pure css jsfiddle Dabblet.com:
Instant preview, increment/decrement by alt+up/down keys

write to style sheet with radio button

I am looking to have a toggle button that will write to a CSS file on the server and switch between visibility:hidden; and visibility:visible on a DIV named building1
I cannot use a style sheet switcher because there will be quite a few of these buttons and DIVS .....it needs to write to the style sheet so the changes will be visible to other users.
Thank You in advance!
I think that this link should help you out. It appends to the stylesheet. I definately think that jquery is the way to go.
Or you could go for this Q/A
If you want the changes to be visible to other users, you'll need to make a call-back to your server so the server can modify the css file.
Example (probably not top-notch, but it works): https://gist.github.com/canihavesomecoffee/4d99b82503e044baaa6d933a7910c82c. I'll have to warn you though, using this way can cause quite a lot of stress on your server if it's called a lot. In that case you'd probably want to select all different ones in one form and submit that once instead of a call for each button.

How to use jQuery to show a different page in ASP.NET

I am trying to set up functionality similar to Netflix. Where if you mouseover a movie - you are presented with a window of movie details (all client-side).
At high level, can someone in this forum help by telling me how this should be implemented? I.E., one or more .aspx pages, what would go in code-behind, and .js file, css, etc. Just trying to get an idea on how this would be set up to work.
Basically, when I hover over an item, I need to query for details that belongs for that record being moused-over and display it in the window or div. I also need to have some functionality in that window (i.e. a textbox and button which will end up needing to get saved in a database).
Thanks for any tips and suggestions -
You would want to add an AJAX call to the hover event of the image, that pulls from a webservice/web method.
Here is a good example, you would change some things. However, it should get you started.
http://www.mikesdotnetting.com/Article/96/Handling-JSON-Arrays-returned-from-ASP.NET-Web-Services-with-jQuery
If I understood your question correctly, you should try this excelent jQuery plugin:
http://www.sohtanaka.com/web-design/css-on-hover-image-captions/
Look at the demo here:
http://www.sohtanaka.com/web-design/examples/image-hover/
easy to install and configure and very slick!
Good luck
EDIT: sorry wrong lik the first time
There are certainly many jQuery plugins that will do this for you. jQuery UI may also be of benefit.
Here is one that appears to do something like you are describing:
http://plugins.jquery.com/project/VisualLightbox

Resources