To use this website completely, it is necessary to store cookies on your computer.
 

* Navigator

Expand - Collapse

* Recent Topics

by feline, [2017 May 23, 06:07:59]

* Statistic

  • *Total Members: 4452
  • *Latest: wintstar

  • *Total Posts: 16688
  • *Total Topics: 2558
  • *Online Today: 11
  • *Most Online: 292
(2016 November 12, 09:37:31)
  • *Users: 1
  • *Guests: 0
  • *Spiders: 4
  • *Total: 5

[TIP] HighSlide for rescaled inline images

Started by feline, 2011 December 29, 14:50:06

previous topic - next topic

0 Members and 0 Guests are viewing this topic.

feline

2011 December 29, 14:50:06 Last Edit: 2012 January 03, 00:18:54 by feline
With two small changes you can use the PortaMx HighSlide for rescaled (smaller) inline images (img tags).
Step 1.. Open the file /Sources/Subs.php and find (~ Line 1269)
Code Select

'content' => '<img src="$1" alt="{alt}"{width}{height} class="bbc_img resized" />',
'validate' => create_function('&$tag, &$data, $disabled', '
$data = strtr($data, array(\'<br />\' => \'\'));
if (strpos($data, \'http://\') !== 0 && strpos($data, \'https://\') !== 0)
$data = \'http://\' . $data;
'),


Replace with:
Code Select

'content' => '<a href="$1" class="highslide" title="Click to enlarge" onclick="return hs.expand(this, {align: \'center\', headingEval: \'this.thumb.alt\'})"><img src="$1" alt="{alt}"{width}{height} class="bbc_img resized" /></a>',
'validate' => create_function('&$tag, &$data, $disabled', '
$data = strtr($data, array(\'<br />\' => \'\'));
if (strpos($data, \'http://\') !== 0 && strpos($data, \'https://\') !== 0)
$data = \'http://\' . $data;
'),


Step 2.. Open the file /Themes/default/scripts/theme.js and find (~ Line 39)
Code Select

// Add a load event for the function above.
addLoadEvent(smc_toggleImageDimensions);


Replace with:
Code Select

// Add a load event for the function above.
// addLoadEvent(smc_toggleImageDimensions);


Now go to Admin - Features and Options - Layout:

Set Max width of posted pictures and Max height of posted pictures to a smaller value, as example 200

Now all NEW inserted images are resized to 200px and can expand in HighSlide with a click on the image.
For exiting images in topics, edit the topic and save it again (without any change).
Many are stubborn in relation to the path, a few in relation to the target.

agent47

#1
2012 January 25, 15:15:30
This is pretty damn awesome! Love it! Thanks a load feline.

zeum

#2
2013 September 14, 06:06:57
How would i go about doing this... But for YouTube videos. The videos don't auto-fit themselves... So you cannot see the full video. I'd like to make the video Auto-Fit to the custom size of the Panel.