Menu
  • HOME
  • TAGS

My image-links won't work

Tag: image,hyperlink,clickable-image

I am trying to link an image, in html looks like this:

<a href="#" class="image"><img src="logo.png"></a>

and in CSS I have:

.baraMeniu a.image{
    display:block;
}

Yeah... display:block is just an awkward try to make the image clickable. I am begginer so please take it step by step.

Edit:I forgot to say that my image has the following properties:

.baraMeniu img{
    width:100%;
    height:40em;
    position:absolute;
    z-index:0;/*the image*/
}
.baraMeniu a.image{
    /*the clickable image*/
}
.baraMeniu .st{
    font-size:2em;
    padding-top:0.15em;
    padding-left:0.7em;
    padding-right:0.5em;
    color:orange;
    font-family:'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
    display:inline;
    text-decoration:none;
    float:left;
}
.baraMeniu .dr{
    font-size:2em;
    padding-top:0.15em;
    padding-left:0.7em;
    padding-right:0.5em;
    color:orange;
    font-family:'Century Gothic', CenturyGothic, AppleGothic, sans-serif;
    display:inline;
    text-decoration:none;
    float:right;
}

.baraMeniu #ind{
    text-indent:20px;
}

Best How To :

If you're trying to wrap an <a> tag around your images, you don't need any special tricks.

<a href="SomeLink.html"><img src="logo.png"></a>

That would work fine.

You can alter its appearance, hover effects, etc with CSS or JS later.

EDIT for clarity. Instead of targeting your image through elements on a page, e.g. a.img.classwhatever{} I would just give it a class of its own or slap it in a div for simplicity's sake. Apply CSS to the class or ID.

<div class="ImageLink">
<a href="SomeLink.html"><img src="logo.png"></a>
</div>

As for the Z-index, please be careful. Negative means it's behind everything else.

Crop does not work for gallery images

android,image,crop

Try this Working code Buttonclick to take camera dialog.show(); Add this inside Oncreate() captureImageInitialization(); try this it will work // for camera private void captureImageInitialization() { try { /** * a selector dialog to display two image source options, from * camera ‘Take from camera’ and from existing files ‘Select...

Fetch a saved image and display

ios,image,path

if you know the image path or name then you may implement something like this. - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{ UICollectionViewCell *cell = [[UICollectionViewCell alloc]initWithFrame:CGRectMake(0, 0, 50.0, 50.0)]; cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"Cell" forIndexPath:indexPath]; UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 50.0, 50.0)]; [imageView setImage:[UIImage...

How to resize image according from screen resolution on html css

html,css,image,screen-resolution

HTML : <div class="img-div"> <img src="path-to-image"> </div> CSS : .img-div { height:100%; width:100%;} img { max-width:100% } ...

what is the nodejs package for s3 image upload

node.js,image,amazon-s3

I recommend using s3-uploader, it's flexible and efficient resize, rename, and upload images to Amazon S3.

How to search images by name inside a folder?

php,mysql,image

This looks like a job for glob, which returns an array of file names matching a specified pattern. I'm aware of the other answer just posted, but let's provide an alternative to regex. According to the top comment on the docs page, what you could do is something like this:...

Python Resize Multiple images ask user to continue

python,xml,image,resize

Change your final loop to: for idx, image in enumerate(imgPath): #img resizing goes here count_remaining = len(imgPath) - (idx+1) if count_remaining > 0: print("There are {} images left to resize.".format(count_remaining)) response = input("Resize image #{}? (Y/N)".format(idx+2)) #use `raw_input` in place of `input` for Python 2.7 and below if response.lower() !=...

Is there a way to make images take up less space in an apk or will I have to use an APK expansion file? [closed]

android,image,android-studio,apk-expansion-files

First of all, mipmap folders are for your app icon only. Any other other resources must be placed in drawable folder. Take a look at this post mipmap vs drawable. And to answer your question, there are several ways to optimize your images and layout to decrease the size of...

Create mask from bwtraceboundary in Matlab

image,matlab,image-processing,mask,boundary

It's very simple. I actually wouldn't use the code above and use the image processing toolbox instead. There's a built-in function to remove any white pixels that touch the border of the image. Use the imclearborder function. The function will return a new binary image where any pixels that were...

Verify data integrity for varbinary column

sql,sql-server,image,sql-server-2012

This worked for me: How to export image field to file? The short version without the cursor looks like this: DECLARE @ImageData VARBINARY(max) DECLARE @FullPathToOutputFile NVARCHAR(2048); SELECT @ImageData = pic FROM Employees WHERE id=5 SET @FullPathToOutputFile = 'C:\51.jpg' DECLARE @ObjectToken INT EXEC sp_OACreate 'ADODB.Stream', @ObjectToken OUTPUT; EXEC sp_OASetProperty @ObjectToken, 'Type',...

Create a border around image when active/clicked

css,image,border,active

This option is suitable? input{ display: none; } label{ display: inline-block; width: 100px; height: 100px; position: relative; border: 4px solid transparent; } input:checked + label{ border: 4px solid #f00; } <input type="radio" id="r1" name="radio" /> <label for="r1"> <img src="http://www.auto.az/forum/uploads/profile/photo-thumb-1.jpg?_r=1431896518" alt="" /> </label> <input type="radio" id="r2" name="radio" /> <label for="r2"> <img...

How to prevent exceeding matrix dimensions while dividing an image into blocks?

image,matlab,image-processing,image-segmentation

If you simply want to ignore the columns/rows that lie outside full sub-blocks, you just subtract the width/height of the sub-block from the corresponding loop ranges: overlap = 4 blockWidth = 8; blockHeight = 8; count = 1; for i = 1:overlap:size(img,1) - blockHeight + 1 for j = 1:overlap:size(img,2)...

Windows Phone 8.1 get image from base64 string

c#,image,windows-phone-8.1

I found a solution that works! var imageBytes = Convert.FromBase64String(base64String); using (InMemoryRandomAccessStream ms = new InMemoryRandomAccessStream()) { using (DataWriter writer = new DataWriter(ms.GetOutputStreamAt(0))) { writer.WriteBytes((byte[])imageBytes); writer.StoreAsync().GetResults(); } var image = new BitmapImage(); image.SetSource(ms); } Found the solution here: Load, show, convert image from byte array (database) in Windows Phone 8.1...

Uploading PNG to Website Server

php,mysql,image,png

You're not declaring $image_width or $image-height and you are referencing $image instead of $source_image in imagecopyresampled(). I too was getting a plain white image, but after this I get the expected result: $image = $_FILES['file']['tmp_name']; $image_name = $_FILES['file']['name']; $ext = pathinfo($image_name, PATHINFO_EXTENSION); $location = "Profiles/{$user}/Picture/{$image_name}"; $new_image = imagecreatetruecolor(100, 100); $source_image...

Excel VBA 2013 Print Image

image,excel-vba,printing

One option is to call Windows Print dialog via shell command. Example: (Full code) Option Explicit Private Declare Function apiShellExecute Lib "shell32.dll" Alias "ShellExecuteA" ( _ ByVal hwnd As Long, _ ByVal lpOperation As String, _ ByVal lpFile As String, _ ByVal lpParameters As String, _ ByVal lpDirectory As String,...

PHP - Read data in .txt and output $Data?

php,hyperlink,passwords,username

$data = file_get_contents('filehere'); if($username == $data) { echo "User found"; } else { echo "User not found"; } user_pass.txt: thomas password john password2 Code: <?PHP $data = fopen('user_pass.txt', 'r'); while (($line = fgets($data)) !== FALSE) { $data = explode(' ', $data); if ($username == $data[0] && $password == $data[1]) {...

Resize images to specific width only (AppleScript or Automator)

image,osx,applescript,image-resizing,automator

You can do this with plain AppleScript and a shell utility entitled sips: on open droppings repeat with everyDrop in droppings set originalFile to quoted form of POSIX path of (everyDrop as text) tell application "Finder" set originalName to everyDrop's name set imageContainer to (everyDrop's container as text) end tell...

Javascript Render an Image from a Link

javascript,image,hyperlink

It's perfectly possible :) function show_image(src, width, height, alt) { var img = document.createElement("img"); img.src = src; img.width = width; img.height = height; img.alt = alt; // This next line will just add it to the <body> tag // but you can adapt to make it append to the element...

Import java package from Matlab deploytool to Android Studio App

java,android,image,matlab,jar

Java components that are generated from MATLAB code using deploytool (or using other functionality from MATLAB deployment products such as MATLAB Compiler, MATLAB Builder etc.) depend on the MATLAB Compiler Runtime (MCR). The MCR has much too large a footprint to run on an Android device, and it's really not...

How to add links to chart.js (Doughnut Charts)?

javascript,hyperlink,charts.js

Adding custom properties in JSON is a feature that may be on the roadmap for v2 (https://github.com/nnnick/Chart.js/issues/1185). As it currently stands, you can add properties in javascript doing something like this: var segments = chart.segments; for (var i = 0; i < segments.length; i++) { segments[i].filter = i+1; } Here's...

Using raphael.js to draw an image with parameters sent through socket.io

javascript,image,socket.io,raphael

You could create a folder under the same folder as the script files and name it as "public" (or whatever you'd like). On your socket-server.js, var express = require('express'); var app = express(); app.use(express.static('public')); //let express access your "public" folder. On your client.html, var mapImg = paper.image("./map.png",x,y,width,height); Paper will try...

Loading images into html5 canvas

javascript,node.js,image,html5-canvas,sails.js

Yes, use a CDN if you have the option. Pros: - Save enormously on website load time / speed. - Better for organization / maintenance. Cons: - One more paid account; but you may end up having to upgrade your hosting anyway if your images continue to add up with...

Can't get images from storage laravel 5

php,image,laravel

What you are trying to do is not possible in the storage directory but possible only in public directory, also exposing the path or URL to your laravel storage directory creates some vulnerability and its bad practice However there is a way to workaround it: First, you need an Image...

Bandpass Filter in Python for Image Processing

python,image,opencv,image-processing,filtering

This might be what you're looking for: http://matplotlib.org/users/image_tutorial.html Specificially look at the "Examining a specific data range" This will allow you to easily clip the image....

why images in the Images.xcassets are not displayed?

ios,image

The problem is that you have not understood the principle of asset catalogs. They give to their assets the names of the image sets. You no longer use the old size-based image names. That is the whole point of asset catalogs! You use one name and the right asset is...

adding link_to with image_tag and image path both

html,ruby-on-rails,image,ruby-on-rails-4,svg

Remove the space after image_tag. <%= link_to '#' do %> My Project <%= image_tag('logo.svg', "data-svg-fallback" => image_path('logo.svg'), :align=> "left" ,:style => "padding-right: 5px;") %> <% end %> ...

Getting an image to render with php

php,image,laravel,image-processing

The code is working - the problem is it's sending extra information. The file is there, it is found, it is being sent. The link to your image returns: HTTP/1.1 200 OK Date: Wed, 17 Jun 2015 22:52:03 GMT Server: Apache Connection: close Content-Type: image/jpeg But the subsequent output is...

Captcha with merging a number with real image

image,image-processing,merge,captcha

Google sources these Captcha images from Street View imagery. Direct quote from Google spokesperson: We’re currently running an experiment in which characters from Street View images are appearing in CAPTCHAs. We often extract data such as street names and traffic signs from Street View imagery to improve Google Maps with...

Convert a column of text URLs into active hyperlinks in Shiny

r,url,hyperlink,datatables,shiny

You need to do two things: Modify the last column so that the KEGGLINK is changed into a proper HTML link that looks like: <a href='url'>link text</a>. Pass DT the escape = FALSE argument so that it doesn't escape the HTML code. The DT web page has an example of...

Best Solution for Bootstrap Carousel Image Size Changes Causing Elements on Page to Move

html,css,image,twitter-bootstrap,carousel

Todd, Hi there. Have a look at this post here to do with Bootstrap carousel. There is a Fiddle with full code for you to use. I have 4 very different sized images in a responsive carousel. The carousel does not change size when each image slides in. You could...

Change Background image in WPF using C# [duplicate]

c#,wpf,image,background,resources

Firstly, add a Folder to your Solution (Right click -> Add -> Folder), name it something like "Resources" or something useful. Then, simply add your desired image to the folder (Right click on folder -> Add -> Existing item). Once it's been added, if you click on the image and...

Make element fill rest of div without resizing Image

html,css,image,width

Your current issue is in the #logo attributes - max-width and max-height won't actually expand the div unless there is content inside that forces it to expand. Also, you'll want to set the background-size = cover so the aspect ratio is maintained. Try this instead: #logo { max-height: 100%; height:...

Rails category (or filter) links in same controller?

ruby-on-rails,ruby,hyperlink,model,controller

belongs_to is defined in ActiveRecord::Associations, which is part of ActiveRecord. You are manually including ActiveModel::Model which doesn't offer any association-related capabilities. Includes the required interface for an object to interact with ActionPack, using different ActiveModel modules. It includes model name introspections, conversions, translations and validations. Besides that, it allows you...

I can't download images uploaded ​​with “move_uploaded_file()” code on filezilla

php,html,image,move

Suppose you rename one of the files which does not works for download to test.jpg to test.gif (assuming that jpg are not working). If it does not work.. Check the permission for read and writes in your control panel for ftp user...

How to make a Javafx Image Crop App

java,image,canvas,graphics,javafx

Your question is too much to be answered on StackOverflow. I suggest you start with reading the official Oracle documentation about JavaFX. However, since it's an interesting topic, here's the answer in code. There are several things you need to consider: use an ImageView as container use a ScrollPane in...

Preload image for seamless background image change in JavaScript

javascript,image,preload

You're not actually passing a callback function: NewImage.onload = ImageLoadComplete(); You're passing in the result of calling ImageLoadComplete(), which means you call your callback immediately. Don't call the function and your code should work as expected (most of the time): NewImage.onload = ImageLoadComplete; One issue that you'll encounter is that...

draw darkened bufferedimage without touching it

java,image,awt

You can use Graphics2D.drawImage(BufferedImage image, BufferedImageOp op, int x, int y) and a RescaleOp to alter the colours when drawing the image: g2.drawImage(image, new RescaleOp( new float[]{0.5f, 0.5f, 0.5f, 1f}, // scale factors for red, green, blue, alpha new float[]{0, 0, 0, 0}, // offsets for red, green, blue, alpha...

Upload image to server from gallary or camera android

android,image,image-uploading

Here is the Code piece for Taking a Picture through Default Camera (here I implemented Intent to to fetch the image). After that store it to SD card(here a new file will be created and the newly taken image will be stored ); and if you don't want to store...

Trouble generating Barcode using ZXing library with large data

java,android,image,barcode,zxing

You can upload the barcode image you produced to the ZXing Decoder Online to confirm if it is valid: http://zxing.org/w/decode.jspx There is no intrinsic limit to the length of a Code 128 barcode, and all the characters you have are valid. Having said that, with Code 128A barcodes, having more...

Saving images with more than 8 bits per pixel in matlab

image,matlab,image-processing,computer-vision

You can use the bitdepth parameter to set that. imwrite(img,'myimg.png','bitdepth',16) Of course, not all image formats support all bitdepths, so make sure you are choosing the the right format for your data....

PHP How to not cache generated HTML but cache static data like images/js/css

javascript,php,css,image,caching

you can use a htaccess to define files that you want to be cached all you want is to make a .htaccess file in the main directory of your website and add this code example: # cache images/pdf docs for 1 week <FilesMatch "\.(ico|pdf|jpg|jpeg|png|gif)$"> Header set Cache-Control "max-age=604800, public, must-revalidate"...

Images not loaded from master page in directory

asp.net,image

@Brendan Hannemann show me a link that where is expaint. The code i must use is: <img src="<%=ResolveUrl("~/afbeeldingen/berichten.png") %>" alt="nieuwe berichten" id="berichten" /> ...

image.Decode results in “unknown format” when source is multipart.File

image,go,martini

The call uploader.Upload reads to the end of the file. Seek back to the beginning of the file before calling CreateThumbnail: func UploadToS3(file multipart.File, /*snip*/) { _, uploadErr := uploader.Upload(&s3manager.UploadInput{ Bucket: aws.String(bucket), Key: aws.String(key), Body: file, ContentType: aws.String(mimeType), ACL: aws.String("public-read"), }) // Seek back to beginning of file for CreateThumbnail...

Dynamically resize side-by-side images with different dimensions to the same height

javascript,html,css,image

If it's responsive, use percentage heights and widths: html { height: 100%; width: 100%; } body { height: 100%; width: 100%; margin: 0; padding: 0; } div.container { width: 100%; height: 100%; white-space: nowrap; } div.container img { max-height: 100%; } <div class="container"> <img src="http://i.imgur.com/g0XwGQp.jpg" /> <img src="http://i.imgur.com/sFNj4bs.jpg" /> </div>...

Better image normalization with numpy

python,image,numpy

Instead of ndimage.zoom you could use scipy.misc.imresize. This function allows you to specify the target size as a tuple, instead of by zoom factor. Thus you won't have to call np.resize later to get the size exactly as desired. Note that scipy.misc.imresize calls PIL.Image.resize under the hood, so PIL...

Make dynamic links (with ?) return error 404 not found

apache,.htaccess,dynamic,hyperlink,http-status-code-404

I assume you're asking for any request containing a query string to return a 404. If that is what you want, use the below: RewriteEngine On RewriteCond %{QUERY_STRING} .+ RewriteRule .* - [R=404,L] This will use the regex .+ to check if there are one or more characters in the...

How to crop image from center using wp_image_editor

wordpress,image,wordpress-plugin,resize-crop,wp-image-editor

Try this code: $crop = array( 'center', 'center' ); resize( $max_w, $max_h, $crop); ...

making an image exactly circular without borders

java,android,xml,image

Yes, finally i solved this problem. If any of you are facing the same problem then use canvas.drawCircle(100, 100, 90, paint); instead of canvas.drawCircle(100, 100, 100, paint); this will definitely solve your problem.

Java encode raw bytes into image simple image fomat/ file

java,image,scala,image-processing

Before you write it out with ImageIO, create a BufferedImage first. It can be as simple as using the setRGB methods, and has the added benefit of allowing you to observe the image before writing it out.

How to convert an Image to Mat Android

android,image,bitmap,mat

I think that i found a possible answer. I give to my ImageReader a simple plane format like JPEG. reader = ImageReader.newInstance(previewSize.getWidth(),previewSize.getHeight(), ImageFormat.JPEG, 2); Then i do that : ByteBuffer bb = image.getPlanes()[0].getBuffer(); byte[] buf = new byte[bb.remaining()]; imageGrab = new Mat(); imageGrab.put(0,0,buf); ...