Cursor CSS Question

  • Resolved mrcavallo

    (@mrcavallo)


    8 years, 4 months ago

    hello,

    this is a very helpful plugin i am using to upload and replace a single PDF to a directory.

    i have been playing around with the CSS and managed to get it looking right – however i simply cannot get the cursor to change to a pointer on the ‘Select File’ button.

    i have tried it on the following:

    input#input_1:hover {
    cursor: pointer;
    }
    input#input_1.file_input_button_hover {
    cursor: pointer;
    }

    but none have worked, even though it has worked for the ‘Upload File’

    input#upload_1:hover {
    cursor: pointer;
    }

    i have even tried using !important

    can you please let me know what i must be missing for this to work on the ‘Select File’ button.

    thank you.

    Mark.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author nickboss

    (@nickboss)

    Hi, please send me the URL to check myself

    Regards

    Nickolas

    Thread Starter mrcavallo

    (@mrcavallo)

    hello Nickolas,

    you can see the page here:

    https://pfdseafood.com.au/weekly-catch-upload/

    just use pfd-seafood to log in.

    thanks.

    Mark

    Plugin Author nickboss

    (@nickboss)

    Ok, here is the code, just add it after the others:

    
input#upfile_1 {
    cursor: pointer;
}

    Please note that normally an HTML form has its own “Select” button, generated by an input element of type “file”, however this button (let’s call it B1) cannot be styled and it doesn’t look good. So, the plugin uses another button (input element of type “button”, let’s call it B2). In order to simulate the click event, B1 is always above B2 but it is invisible. So when the user clicks on B2, he actually clicks on B1 so that the file selection dialog can open. As a result, you need to change the cursor attribute of B1 and not B2.

    Regards

    Nickolas

    Thread Starter mrcavallo

    (@mrcavallo)

    hi Nickolas,

    that worked. your explanation makes sense, tho i am not sure i would have figured that out.

    thank you very much.

    Mark.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Cursor CSS Question’ is closed to new replies.